MudBlazor 对话框不显示 .NET 8

Question

我正在学习 blazor，并正在使用 MudBlazor 和 .NET 8 开发一个相对简单的 blazor 应用程序。我有点不明白为什么这不起作用。我想打开一个简单的对话框，正如 documentation 中的示例所示，我已将

<MudDialogProvider />

添加到我的

MainLayout.razor

中，并按如下方式定义对话框：

测试剃刀

@inject IDialogService DialogService
@rendermode InteractiveServer

<h3>Test</h3>
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="@Add">Add</MudButton>
    
@code { 
  private void Add() {
    var options = new DialogOptions { CloseOnEscapeKey = true };
    DialogService.Show<TestDialog>("Test", options);
  }
}

TestDialog.razor

<MudDialog>
  <DialogContent>
    Dialog Test
  </DialogContent>
  <DialogActions>
    <MudButton Color="Color.Primary" OnClick="Submit">Ok</MudButton>
  </DialogActions>
</MudDialog>

@code {
  [CascadingParameter] MudDialogInstance MudDialog { get; set; }

  void Submit() => MudDialog.Close(DialogResult.Ok(true));
}

MainLayout.razor

@inherits LayoutComponentBase

<MudThemeProvider />
<MudDialogProvider />
<MudSnackbarProvider />

<MudLayout>
  <MudAppBar>
    <MudIconButton Icon="@Icons.Material.Filled.Menu" Color="Color.Inherit" Edge="Edge.Start" OnClick="@((e) => DrawerToggle())" />
    My Application
  </MudAppBar>
  <MudDrawer @bind-Open="@_drawerOpen">
    <NavMenu />
  </MudDrawer>
  <MudMainContent>
    @Body
  </MudMainContent>
</MudLayout>

@code {
  bool _drawerOpen = true;

  void DrawerToggle() {
    _drawerOpen = !_drawerOpen;
  }
}

按下查看按钮时，没有任何反应，也没有抛出错误。我也尝试过将

@rendermode InteractiveServer

添加到

TestDialog.razor

但这也没有改变任何东西。调试时，它达到了

DialogService.Show

，现在出现问题并且不会抛出错误。对于大多数遇到此问题的人来说，似乎缺少

<MudDialogProvider />

来解决它，但我已经添加了该问题。

如果我尝试将

@rendermode InteractiveServer

添加到

MainLayout.razor

，我会收到以下错误：

InvalidOperationException: Cannot pass the parameter 'Body' to component 'MainLayout' with rendermode 'InteractiveServerRenderMode'. This is because the parameter is of the delegate type 'Microsoft.AspNetCore.Components.RenderFragment', which is arbitrary code and cannot be serialized

这篇文章建议将渲染模式添加到

App.razor

，这可以正常工作，但也无助于解决对话框问题。

我的应用程序当前设置为仅在 Interactive Servcer 渲染模式下运行。我在这里忽略了一些非常明显的东西吗？

Answer 1

尝试将

<MudDialogProvider />

放入您的 Test.razor 文件而不是 MainLayout.razor 中，这就是我显示对话框的方法。