单击时传递组件名称

问题描述

我该如何传递通过Blazor WebAssembly中的onclick处理程序单击的组件的名称？例如（在这种情况下，我们将使用表格单元格）：

InterestingTable.razor

<table class="table">
    <thead>
        <tr>
            <th scope="col">First</th>
            <th scope="col">Second</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td @onclick="@(e => CellClicked(e,?????))" name1="firstTd"><SomeComponent name2="firstComponent" /></td>
            <td @onclick="@(e => CellClicked(e,?????))" name1="secondTd"><SomeComponent name2="secondComponent" /></td>
        </tr>
    </tbody>
</table>

InterestingTableBase.cs

protected void CellClicked(MouseEventArgs e,????) {

        }

如何将name1或name2中的字符串传递给onclick处理程序？

谢谢！

解决方法

在javascript中，当调用dom事件处理程序时，处理程序内的this关键字设置为在其上注册了处理程序的DOM元素。在Blazor中并非如此。您要么必须创建一个组件，要么必须使用本机元素将值存储在代码部分中，以便可以在事件处理程序中访问它们。

Index.razor：

<div name="@myDivName" @onclick="MyHandler2"></div>

<Component Name="Foo" OnClick="MyHandler"></Component>


@code{

    private string myDivName = "foo";

    public void MyHandler2()
    {

    }

    public void MyHandler(string name)
    {

    }

}

Component.razor：

<div name="@Name" @onclick="()=>OnClick.InvokeAsync(Name)"></div>

@code {
    [Parameter]
    public string Name { get; set; }
    [Parameter]
    public EventCallback<string> OnClick { get; set; }
}

blazor c#c#