Home > Net >  Using Blazor components (Telerik / MudBlazor) in Razor ASP.NET Core MVC
Using Blazor components (Telerik / MudBlazor) in Razor ASP.NET Core MVC

Time:08-30

I have tried (unsuccessfully) using Telerik and / or MudBlazor components in Umbraco - ASP.NET Core 6 MVC razor view application (running razor components on razor views - hence Blazor components, because .NET Core ones are not able to run in razor components). Is using javascript components really the only way?

I configure services, everything works fine, but then the wrapper syntax (<MudThemeProvider/> for mudblazor) is not being recognized.

For Telerik, I get an error, where it says that some Telerik.Documents.Spreadsheets assembly is missing; I copied the .dll files from elsewhere and referenced it in the project and it still does not work.

Does anybody know if it's even possible?

CodePudding user response:

There's a way can allow you use blazor components in Razor Page. Here's what I test:
Step1: Create your blazor component and put it under the folder Components, here is the following content:

<h3>Count</h3>

<p>Current count: @currentCount</p>
<button  @onclick="IncrementCount">Click me</button>

@code {
    private int currentCount = 0;

    [Parameter]
    public int InitialValue { get; set; }

    private void IncrementCount() => currentCount  ;

    protected override void OnParametersSet()
    {
        currentCount = InitialValue;
    }
}

Step2: Change the Program.cs file to add Blazor services builder.Services.AddServerSideBlazor(); and map the required endpoints endpoints.MapRazorPages(); endpoints.MapBlazorHub();

Step3: Integrate the Blazor component into a razor page, such as Index.razor, and add the script. Following code is which adding to the index.razor:

<component type="typeof(YourProjectName.Components.Counter)" param-InitialValue="0" render-mode="Server" />

@section Scripts {
    <script src="_framework/blazor.server.js"></script>
}

After this, it should be working: Demo Pic
If my answer is helpful to your porblem, please give me a mark, thank you for your support.
Great Day.

  • Related