Blazor 测试页面未打开 Modal

Question

我有以下代码，但当它呈现到浏览器时，它没有 onClick 调用，因此单击按钮没有任何效果（对我来说，这是我的第一个 Blazor 应用程序）：

我有一个 UserComponent，它是默认组件。我有第二个组件 UserEdit 组件。

当我运行解决方案时，单击按钮没有任何反应。我在这里缺少什么？

// UserComponent

@page "/"
    
    <Modal @ref="modal" />
    
    <Button Color="ButtonColor.Primary" @onclick="ShowUserEditComponent">Show Employee Component</Button>
    
    @code {
        private Modal modal = default!;
    
        private async Task ShowUserEditComponent()
        {
            var parameters = new Dictionary<string, object>();
            parameters.Add("Id", new Guid("F19958EB-DBD7-450E-9418-09F25D26C91B"));
            await modal.ShowAsync<EditUserModal>(title: "User Details", parameters: parameters);
        }
    }

// UserEditComponent
@using BlazorApp1.Components.Domain.Users

<div class="row">
    <div class="col-5 col-md-3 text-end">Id :</div>
    <div class="col-7 col-md-9">@Id</div>
</div>
<div class="row">
    <div class="col-5 col-md-3 text-end">First Name :</div>
    <div class="col-7 col-md-9">@user?.FirstName</div>
</div>
<div class="row">
    <div class="col-5 col-md-3 text-end">Last Name :</div>
    <div class="col-7 col-md-9">@user?.LastName</div>
</div>

@code {
    private UserDto? user;

    [Parameter] public int Id { get; set; }

    protected override void OnInitialized()
    {
        // get employee with {EmployeeId} from DB

        user = new UserDto { FirstName = "Jim", LastName = "Beam" };

        base.OnInitialized();
    }
}

Answer 1

如果我们想使用

BlazorBootStrapper.Modal

，我们应该安装

Blazor.Bootstrap

。

然后我们就可以按照博客(入门-Blazor Server (.NET 7))来使用了。

这是我的测试结果

UserComponent和UserEditComponent代码和你的一样，重要的东西我们应该在

AddBlazorBootstrap

中注册

Program.cs file

。