单击 syncfusion blazor 中的 NavLink 项目时如何弹出模式？

Question

我正在创建一个包含 6 个 NavLink 菜单项的菜单，如果用户确定是否注销但我无法弹出使用@onclick 函数的模式..?

HTML:

<li class="nav-item px-3" id="li6">
        <NavLink class="nav-link" @onclick="OnClicked">
            <span class="oi oi-list-rich" aria-hidden="true"></span> Sign Out
        </NavLink>
</li>

C#:

//Modal
private bool IsVisible { get; set; } = true;

private void OnClicked()
{
    this.IsVisible = true;
}

private void OnOverlayclick(object arg)
{
    this.IsVisible = false;
}

模态本身：

<SfDialog @bind-Visible="@IsVisible" Width="250px" IsModal="true">
    <DialogEvents OnOverlayClick="OnOverlayclick">
    </DialogEvents>
    <DialogTemplates>
        <Content> This is a modal dialog</Content>
    </DialogTemplates>
</SfDialog>

有人能看出我做错了什么吗？希望有人能帮忙！谢谢！

Answer 1

Niels，我尝试创建一个带有共享代码片段的剃刀页面。模式在 "Sign-Out" 单击时正确显示。此外，单击叠加层时模态隐藏。如果可能，请分享您的剃须刀页面。

@using Syncfusion.Blazor.Popups
<div>
    <div id="container"></div>
    <ul>
        <li class="nav-item px-3" id="li6">
            <NavLink class="nav-link" @onclick="OnClicked">
                <span class="oi oi-list-rich" aria-hidden="true"></span> Sign Out
            </NavLink>
        </li>
    </ul>

    <SfDialog @bind-Visible="@IsVisible" Width="250px" IsModal="true">
        <DialogEvents OnOverlayClick="OnOverlayclick">
        </DialogEvents>
        <DialogTemplates>
            <Content> This is a modal dialog</Content>
        </DialogTemplates>
    </SfDialog>
</div>

@code{
    //Modal
    private bool IsVisible { get; set; } = true;

    private void OnClicked()
    {
        this.IsVisible = true;
    }

    private void OnOverlayclick(object arg)
    {
        this.IsVisible = false;
    }
}```

单击 syncfusion blazor 中的 NavLink 项目时如何弹出模式？

How to pop up a modal when clicking on a NavLink item in syncfusion blazor?

c#

modal-dialog

syncfusion

blazor