Blazor parent-child example button missing?

Question

i made a new blazor app with

dotnet new blazor

https://docs.microsoft.com/en-us/aspnet/core/blazor/components?view=aspnetcore-3.0

then i added the parent and child razor components from this tutorial

Parent.razor

@page "/ParentComponent"

<h1>Parent-child example</h1>

<ChildComponent Title="Panel Title from Parent"
                OnClick="@ShowMessage">
    Content of the child component is supplied
    by the parent component.
</ChildComponent>

<p><b>@messageText</b></p>

@functions {
    private string messageText;

    private void ShowMessage(UIMouseEventArgs e)
    {
        messageText = "Blaze a new trail with Blazor!";
    }
}

Child.razor

<div class="panel panel-default">
    <div class="panel-heading">@Title</div>
    <div class="panel-body">@ChildContent</div>

    <button class="btn btn-primary" onclick="@OnClick">
        Trigger a Parent component method
    </button>
</div>

@functions {
    [Parameter]
    private string Title { get; set; }

    [Parameter]
    private RenderFragment ChildContent { get; set; }

    [Parameter]
    private EventCallback<UIMouseEventArgs> OnClick { get; set; }
}

it kinda works in that it shows the child and the text content passed from parent to child and the title... but there is no button and therefore no message and no updating of message text

enet enet · Accepted Answer · 2019-05-12T15:26:32

Are your components (.razor) sit in a folder named Pages ? Try to close Visual Studio, and then run your app again. This is very strange...

Blazor parent-child example button missing?

2 Answers