C# Blazor：将一个函数传递给一个组件并从中调用它

我正试图将Blazor服务器项目拆分为多个组件，以使其更易于管理

我希望我的组件有一个作为参数传入的函数。该函数接受一个字符串参数，当单击按钮时，将使用与组件不同的名称调用该函数

我尝试了一些在网上找到的答案，但它们似乎不起作用（比如绑定事件）

代码 我有一个名为

itemsmenu.razor

的组件和我的索引页

index.razor

itemsmenu.razor

：

福
发出砰的声响
@代码{
[参数]公共操作onClick函数{get；set；}
常量字符串foo=“bar”；
常量字符串ping=“pong”；
}

Index.razor

：

@page/“
这是我的索引页！
@*错误：“ShowName”没有重载与委托“Action”匹配*@
@代码{
public void ShowName（字符串myName）
{
Console.WriteLine（我的名字）；
}
}

错误

Index.html

中的第3行抛出错误

没有重载“ShowName”匹配委托“Action”

解决方案 原来我只需要将变量重命名为

OnClick

，而不是

OnClick函数

Ok@enet指出变量名不是问题所在。 在blazor中，我们应该使用EventCallback，而不是Action

---

事实证明，在我的案例中真正的问题是Visual Studio，因为我在前面查看其他答案时发现了此解决方案。VS决定在这一行显示一个错误，即使它编译并运行良好…

您的绑定有点短；）

OnClick.InvokeAsync（“foo”）>foo
OnClick.InvokeAsync（“ping”）>ping
@代码{
[参数]
public EventCallback OnClick{get；set；}
}

@page/“
这是我的索引页！
@*错误：“ShowName”没有重载与委托“Action”匹配*@
@代码{
public void ShowName（字符串myName）
{
Console.WriteLine（我的名字）；
}
}

注意：问题不在于您在给Brian的评论中所表达的函数的命名。问题是您使用了动作委托，但动作委托不返回值，或者说它返回void。您可以改用Func委托，以便调用方法并返回值。但是，Blazor中正确的方法是使用EventCallback结构，它为您生成合适的委托。它还有其他好处

剃刀

foo
发出砰的声响
@代码{
[参数]public EventCallback onclick函数{get；set；}
常量字符串foo=“bar”；
常量字符串ping=“pong”；
}

剃刀索引

@page/“
这是我的索引页！
@*错误：“ShowName”没有重载与委托“Action”匹配*@
@代码{
public void ShowName（字符串myName）
{
Console.WriteLine（我的名字）；
}
}

好的，谢谢，原来我只需要将变量重命名为OnClick而不是OnClick function好的，我知道发生了什么，问题一直是在Visual Studio中。。。它抱怨这一行有错误，但它编译并运行良好。。。我现在明白答案了。非常感谢。这回答了你的问题吗？

<button @onclick=@(() => OnClick.InvokeAsync("foo"))>foo</button>
<button @onclick=@(() => OnClick.InvokeAsync("ping"))>ping</button>

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

@page "/"

<h1>This is my index page!</h1>

<ItemMenu OnClick="ShowName" /> @*Error: No overload for 'ShowName' matches delegate 'Action'*@

@code {
    public void ShowName(string myName)
    {
        Console.WriteLine(myName);
    }
}

<button @onclick="() => OnClickFunction.InvokeAsync(foo)">foo</button>
    <button @onclick="() => OnClickFunction.InvokeAsync(ping)">ping</button>
    
    @code {
        [Parameter] public EventCallback<string> OnClickFunction { get; set; }
    
        const string foo = "bar";
        const string ping = "pong";
    }

@page "/"

<h1>This is my index page!</h1>

<ItemMenu OnClick="ShowName" /> @*Error: No overload for 'ShowName' matches delegate 'Action'*@

@code {
    public void ShowName(string myName)
    {
        Console.WriteLine(myName);
    }
}