相关疑难解决方法(0)

我有一个带有MainLayout页面的 Blazor 应用程序，它@Body可以加载实际的页面内容。

在我的情况下Index.razor是在MainLayout页面内加载的。

有没有办法从位于父页面中的子页面（Index.razor）调用方法；MainLayout.razor?

例子：

MainLayout.razor

<div class="content">
<ul class="menu">
  <li>menu item 1</li>
</ul>

@Body

</div>

@code
{
    public async Task Test()
    {
        await JsRuntime.InvokeAsync<object>("console.log", "test parent");
    }
}

Index.razor

<h1>This is the index page</h1>
<button @onclick="(async () => await btn_clicked())">Call parent method</button>

@code
{
    // Call method in MainLayout
    public async Task btn_clicked()
    {
        await parent.Test();
    }
}

我有一个 Blazor 服务器端应用程序，试图了解其结构。在 MainLayout.razor 页面中，我看到了标签 @Body，这是每个页面内容的呈现位置。

我想知道，是否可以向 mainLayout 页面添加额外的渲染元素？例如，@Header 部分。而且我更愿意在每个单独的页面中定义这个部分。

换句话说，对于每个页面，除了主要内容之外，还需要定义Header、Footer，或者我在MainLayout中定义的任何渲染元素。这样，我可以自定义每个页面唯一的页眉/页脚元素。

谢谢你的帮助。