Split HTML And C# Code In Blazor Using Partial Class

Partial Class is a feature of implementing a single class into multiple files. So now we will maintain the Html code in Counter.razor file and C# code in Counter.razor.cs file. Counter.razor.cs file acts as a code-behind file for Counter.razor file.

Counter.razor

@page "/counter"

<PageTitle>Counter</PageTitle>

<h1>Counter</h1>

<p role="status">Current count: @currentCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>

Counter.razor.cs

namespace BlazorApp1.Pages;

public partial class Counter
{
    private int currentCount = 0;

    private void IncrementCount()
    {
        currentCount++;
    }
}

References
https://www.learmoreseekmore.com/2020/06/blazor-paratial-class-or-componentbase-class.html

Related