Blazor：如何从子组件中的事件中获取发件人答案

【问题标题】：Blazor: How to get sender from event in child componentBlazor：如何从子组件中的事件中获取发件人
【发布时间】：2019-12-15 03:10:59
【问题描述】：

我已经制作了一个带有docs中描述的事件的组件

如果我使用组件的多个实例，有什么方法可以告诉我是哪个实例触发了事件？
在“常规”.net 中通常有一个 sender 参数。

见我的BlazorFiddle
...或者在这里查看我的示例代码：

子组件

<div class="panel panel-default">
    <div class="panel-heading">@Title</div>
    <div class="panel-body">@ChildContent</div>

    <button class="btn btn-primary" @onclick="OnClick">
        Trigger a Parent component method
    </button>
</div>

@code {
    [Parameter]
    private string Title { get; set; }

    [Parameter]
    private RenderFragment ChildContent { get; set; }

    [Parameter]
    private EventCallback<UIMouseEventArgs> OnClick { get; set; }
}

索引

@page "/"

<ChildComponent Title="Panel Title from Parent"
                OnClick="@ShowMessage">Hello child 1</ChildComponent>

<br>
<br>

<ChildComponent Title="Panel Title from Parent"
                OnClick="@ShowMessage">Hello child 2</ChildComponent>

<br>
<br>
<p><b>@messageText</b></p>

@code {
    private string messageText;

    private void ShowMessage(UIMouseEventArgs e)
    {
        // How do I get which ChildComponent was the sender?
        messageText = DateTime.Now.ToString() + ": Message from child ?"
    }
}

我希望能够从 Index 中 ShowMessage-function 中的发送 ChildComponent 获取数据。

【问题讨论】：

标签： asp.net-core blazor

【解决方案1】：

很遗憾，您没有发件人，并且此主题已在此处讨论过：https://github.com/aspnet/Blazor/issues/1277。

没有。这将涉及创建一些新方法来跟踪一个 DOM 元素。

如果你能够在更高的层次上描述什么样的您尝试实现的功能，可能还有更多惯用的 Blazor 方式来简单地实现您想要的。

解决方法是将参数（事件和其他）显式传递给您的 ShowMessage 方法。

@page "/"

<ChildComponent Title="Panel Title from Parent"
                OnClick="@((ev) => ShowMessage(ev, 1))">Hello child 1</ChildComponent>

<br>
<br>

<ChildComponent Title="Panel Title from Parent"
                OnClick="@((ev) => ShowMessage(ev, 2))">Hello child 2</ChildComponent>

<br>
<br>
<p><b>@messageText</b></p>

@code {
    private string messageText;

    // ex: Blazor 0.7 (Old)
    private void ShowMessage(UIMouseEventArgs e, int childId)
    {
        // How do I get which ChildComponent was the sender?
        messageText = DateTime.Now.ToString() + ": Message from child " + childId.ToString();
    }

    // ex: .NET Core 3.0 (Updated)
    // UIMouseEventsArgs were removed
    // Replace Microsoft.AspNetCore.Components.UIEventArgs with System.EventArgs and remove the “UI” prefix from all EventArgs derived types (UIChangeEventArgs -> ChangeEventArgs, etc.).
    // https://devblogs.microsoft.com/aspnet/asp-net-core-and-blazor-updates-in-net-core-3-0-preview-9/
    private void ShowMessage(MouseEventArgs e, int childId)
    {
        // How do I get which ChildComponent was the sender?
        messageText = DateTime.Now.ToString() + ": Message from child " + childId.ToString();
    }
}

这里是旧的 BlazorFiddler (Blazor 0.7)：https://blazorfiddle.com/s/9zh85obk

在此处更新 BlazorFiddler (.NET Core 3.0)：https://blazorfiddle.com/s/5p45emmo

为了跟踪是否会有任何更新，您可以关注此问题：https://github.com/aspnet/AspNetCore/issues/5501

【讨论】：