Add section to components article on using a code behind file about blazor.docs HOT 2 CLOSED

Yup, I think we should just add that section back.

from blazor.docs.

@danroth27 We had it for a bit but cut it temporarily. Here's what we cut ... would this suffice? (If 'yes', where in the topic would you like it to appear?)

Note: I also cut BlazorRocks.cshtml and BlazorRocksBase.cs out of the sample app, but I have the files here, so I can shoot them back into the sample with the section.

Base class inheritance for a "code-behind" experience

Blazor's Razor files (*.cshtml) mix HTML markup and C# processing code in the same file. The @inherits directive can be used to provide Blazor with a "code-behind" experience that separates view markup from processing code.

The Components Sample app shows how a component can inherit a base class, BlazorRocksBase, to provide its properties and methods.

BlazorRocks.cshtml:

[!code-cshtml]

... it shows this ...

@page "/BlazorRocks"
@inherits BlazorRocksBase

<h1>@BlazorRocksText</h1>

BlazorRocksBase.cs:

[!code-csharp]

... it shows this ...

using Microsoft.AspNetCore.Blazor.Components;

public class BlazorRocksBase : BlazorComponent
{
    public string BlazorRocksText { get; set; } = 
        "Blazor rocks the browser!";
}

The base class must derive from BlazorComponent in the Microsoft.AspNetCore.Blazor.Components namespace.

from blazor.docs.