模型弹出窗口正在工作，但不是 Blazor 中的弹出方式

Question

我使用 Blazor，并希望实现通知或信息的弹出功能。 我已经使用这篇文章来做到这一点，一切正常，唯一的问题是弹出窗口显示在页面中而无需单击，并且窗口没有像我预期的那样弹出。 我也尝试过 Github 上可用的项目并且它工作正常，唯一的问题是如果我试图实现它弹出窗口出现在每个页面上，因为我在 Mainlayout.razor 组件上添加了模型而无需单击按钮。

弹出窗口的屏幕截图，该窗口没有弹出，仍在每个页面的左上角

如果我错过了什么，请帮助我。

剃刀组件代码

@page "/"
@inject SessionState  state
@inject IModalService Modal
<div id="Login_div" align="center">
<button class="btn btn-primary" @onclick="ShowModal">Login</button>
</div>
@code {
private void ShowModal()
{
var parameters = new ModalParameters();
parameters.Add("FormId", 11);
Modal.OnClose += ModalClosed;
Modal.Show<YesNoPrompt>("Sign Up Form", parameters);
}
void ModalClosed(ModalResult modalResult)
{
Console.WriteLine("Modal has closed");
if (modalResult.Cancelled)
{
Console.WriteLine("Modal was Cancelled");
}
else
{
Console.WriteLine(modalResult.Data.ToString());
}
Modal.OnClose -= ModalClosed;
}

请注意@inject IModalService Modal我在上面的段落中提到的带有帖子或 github 的 im，因为不可能在这里显示完整的代码。

Answer 1

我能找到的一个小细节是，您在没有实现 IDisposable 接口的情况下订阅和取消订阅事件。这可能会导致内存泄漏和一些难以找到的错误。

就像在不调用ModalClosed方法的情况下离开页面一样。 小样本

@using System
@implements IDisposable
...
@code {
public void Dispose()
{
...
}
}

官方文档的链接。