Blazor component

De Banane Atomic
Aller à la navigationAller à la recherche

Basic component

Components/MyComponent.razor
<h1>Test</h1>
<p>@ChildContent</p>
Components/MyComponent.razor.cs
public partial class MyComponent : ComponentBase
{
    [Parameter]
    public RenderFragment ChildContent { get; set; }
}
Components/MyComponent.razor.css
h1 {
    color: coral;
}
Pages/Index.razor
@page "/"
@using Component.Components

<MyComponent>
    test !!!
</MyComponent>

Callback event

Components/MyComponent.razor.cs
[Parameter]
public EventCallback<string> Callback { get; set; }

private string description;

private async Task Ok()
{
    await Callback.InvokeAsync(description);
}
Pages/Index.razor
<MyComponent Callback="MyComponentCallback" />

@code {
    void MyComponentCallback(string description)
    {

    }
}