Blazor 父子示例按钮丢失？答案

【问题标题】：Blazor parent-child example button missing?Blazor 父子示例按钮丢失？
【发布时间】：2019-09-29 17:06:50
【问题描述】：

我用

制作了一个新的 blazor 应用程序

dotnet new blazor

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

然后我添加了本教程中的父子剃须刀组件

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; }
}

它有点工作，因为它显示了孩子和从父母传递给孩子的文本内容和标题......但是没有按钮，因此没有消息，也没有消息文本的更新

【问题讨论】：

标签： blazor

【解决方案1】：

您的组件 (.razor) 是否位于名为 Pages 的文件夹中？尝试关闭 Visual Studio，然后再次运行您的应用。这很奇怪……

【讨论】：

它们在 pages 文件夹中...我正在使用 vscode... 将尝试重命名页面 ParentComponent.razor 而不是 Parent.razor 像路由一样

【解决方案2】：

页面文件名必须与@Page定义的路由匹配？

虽然不一样也没有错误信息显示？

将我的 Parent.razor 和 Child.razor 重命名为 ParentComponent.razor 和 ChildComponent.razor 修复它。原谅我的无知。谢谢。

编辑：哦，我猜文件名必须与剃须刀代码中的“ChildComponent”匹配

【讨论】：

不，@Page 可以是任何东西。但是文件名变成了类名变成了组件名。