Code Murals

What RenderFragment is and how to use it in an application will be covered in this blog. The component and content are rendered with the aid of the RenderFragment. Reusing the components is made easier by the templated component. RenderFragment and RenderFragment<T> are the two different sorts of render elements. RenderFragment - It is a just a simple razor content RenderFragment<T> - It allows parameters within the razor content. The context keyword helps to set a parameter within the razor content. Let's start by looking at a simple RenderFragment example. The code for the child component is as follows. In this case, ChildContent is declared as RenderFragment. The UI segment is rendered by this RenderFragment. additionally, the @ChildContent is put within the <div> element. Child.razor < h3 >Child</ h3 > < div   class = "alert alert-primary" >      @ ChildContent </ div > @ code   {   ...

This blog is going to explain what a Dynamic Component is and how to use it. It is a built-in component used to render components by type. The Dynamic Component has two arguments which are type and parameter. Type is a component type and parameter is the parameter to be sent to the component. Let's see how to implement Dynamic Components in Blazor. Below is a basic example of how to implement Dynamic Components. The "typeof(Counter)" is assigned to the Type property. It will render the Counter component in the index page. index.razor @page   "/"   < h3 > Dynamic Component Demo </ h3 > < h4 > Index Page </ h4 >   < DynamicComponent   Type = "typeof(Counter)"  /> The following image is the output of the code snippets above. You can see here the Counter Component is rendered by Dynamic Component. Pass Parameter Let us see how to send the parameter to the component. The Dynamic Compo...

This blog is going to explain what is Error Boundary in Blazor and how to implement it in the application. The Error Boundary is an easy way to handle the exception. If there is no error it will render the content, otherwise it will display the error message. Wrapping error Error Boundary component around the content will handle the unhandled exception. Let’s see this with an example. The following is the Index.razor page. Here I have added the Counter component covered by the <ErrorBoundary> component. Index.razor @page   "/"   < PageTitle > Index </ PageTitle >   < h1 > Hello, world! </ h1 >   Welcome to your new app.   < SurveyPrompt   Title = "How is Blazor working for you?"  />   < ErrorBoundary > < Counter  /> </ ErrorBoundary > To demonstrate the error handling process. I have modified the existing IncrementCount() as follows. So...