具有自定义 EventCallback 的 Blazor 组件不起作用

Question

我正在为我的 Blazor WebAssembly 创建一个非常简单的 Blazor 组件。该组件是一个模态对话框。当用户点击 Cancel 按钮时 EventCallBack return false, true 对于好的。代码在这里。

<div class="modal fade show" id="myModal" 
     style="display:block; background-color: rgba(10,10,10,.8);" 
     aria-modal="true" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">@Title</h4>
                <button type="button" class="close" 
                        @onclick="@ModalCancel">&times;</button>
            </div>
            <div class="modal-body">
                <p>@Text</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn" 
                        @onclick="@ModalCancel">Cancel</button>
                <button type="button" class="btn btn-primary" 
                        @onclick=@ModalOk>OK</button>
            </div>
        </div>
    </div>
</div>

@code {
    [Parameter] public long Id { get; set; }
    [Parameter] public string Title { get; set; }
    [Parameter] public string Text { get; set; }
    [Parameter] public ModalDialogType DialogType { get; set; }
    [Parameter] public EventCallback<bool> OnClose { get; set; }

    private Task ModalCancel()
    {
        //return OnClose.InvokeAsync(new ModalDialogResponse()
        //{
        //  Id = Id,
        //  IsOk = false
        //});
        return OnClose.InvokeAsync(false);
    }

    private Task ModalOk()
    {
        //return OnClose.InvokeAsync(new ModalDialogResponse()
        //{
        //  Id = Id,
        //  IsOk = true
        //});
        return OnClose.InvokeAsync(true);
    }
}

现在，当主页收到 EventCallback 时，Id 是什么？然后，我想为 Id 添加一个参数，而回调 return 是一个自定义响应

public class ModalDialogResponse
{
    public long Id { get; set; }
    public bool IsOk { get; set; }
}

如果我在组件中声明

[Parameter] public EventCallback<ModalDialogResponse> OnClose { get; set; }

然后在主页中我将模式对话框称为

<ModalDialog Title="My title" Text="Here the message"
             Id="@ItemId"
             OnClose="@OnCloneDialogClose"
             DialogType="ModalDialogType.YesNo" />

然后

private async Task OnCloneDialogClose(ModalDialogResponse response)
{
}

Visual Studio 给我一个错误

CS1503 Argument 2: cannot convert from 'method group' to 'EventCallback'

我不明白哪里错了。

Answer 1

我记得当您更改回调的签名（例如，从 bool 更改为 ModalDialogResponse）时，Blazor 不喜欢它。我经常看到类似的错误。但是，完全重建通常可以解决问题。

您也可以尝试注释掉您的，重建然后放回去再试一次。

或者，删除 obj 和 bin 目录并重建。

最后，如果您正在寻找 Id，而不是将其传回，因为您已经在父组件中拥有它，您可以使用：

<ModalDialog Title="My title" Text="Here the message"
             Id="@ItemId"
             OnClose=@((isOk) => OnCloneDialogClose(isOk, @ItemId))
             DialogType="ModalDialogType.YesNo" />

private async Task OnCloneDialogClose(bool isOk, long id)
{
}

并保持 EventCall 返回声明为：

[Parameter] public EventCallback<bool> OnClose { get; set; }

具有自定义 EventCallback 的 Blazor 组件不起作用

Blazor component with custom EventCallback doesn't work

blazor

blazor-webassembly