Blazor 事件回调问题父/子组件"does not have a property matching the name 'OnClickCallback'"



问题

因此,我在Blazor中遇到了一个问题,我试图从子组件(NavMenu(调用MainLayout父组件中的一个方法。我所要做的就是在NavMenu子组件中的一个按钮上被告知后,在MainLayout父组件中打开一个对话框。

我假设这是允许的,因为NavMenu和MainLayout的父/子概念仍然相同。

我尝试过的

我已经关注了这里的微软文档,但我似乎根本无法做到这一点。我希望我正在做一些愚蠢的,一双新的眼睛可能会发现这个问题。

当前结果

基本上,一切都构建得很好,但当我运行应用程序时,web控制台中会显示以下错误:

Error: System.InvalidOperationException: Object of type 'MyProject.Shared.Components.NavMenu' does not have a property matching the name 'OnClickCallback'.

代码

父组件(主布局(

<NavMenu OnClickCallback="@Foo()">
<label>Text value: @text</label>
</NavMenu>
@code {
private string text { get; set; }
async Task Foo()
{
text = "IT WORKS";
// In reality I will actually open a dialog here on the screen
}
}

子组件(导航菜单(

<MatNavItem AllowSelection="false" @onclick="OnClickCallback">
<MatIcon>settings</MatIcon><span class="miniHover"> Test App Settings</span>
</MatNavItem>
@code {
[Parameter]
public EventCallback OnClickCallback { get; set; }
// I have also tried the "type" event callbacks such as public EventCallback<bool> OnClickCallback { get; set; } - but still get the same result
}

这是我的第一个堆栈溢出问题,所以希望我做对了。

提前谢谢大家。

解决方案:

在得到一些有用的答案后,这个问题是由于我有两个NavMenu组件,我认为MainLayout看不到其中一个,但事实并非如此,所以我消除了两者之间的歧义。

一些答案还表明,我的父组件OnClickCallback="Foo((">应该是OnClickCallback="Foo">这实际上解决了我后来遇到的一个问题。

我的子组件现在也使用:

<MatNavItem AllowSelection="false" @onclick="@(() => OnClickCallback.InvokeAsync(true))">

调用父组件中的回调,这将按预期打开我的对话框。

感谢所有帮助它的人。

错误非常明显:

。NavMenu"没有与名称"OnClickCallback"匹配的属性。

因此错误与您的代码不匹配。NavMenu子组件确实具有该参数属性。

您应该使用<NavMenu OnClickCallback="Foo">,而不是@(),但这不能解释此错误。

最好的猜测是,您有两个名为<NavMenu>的组件,但您看错了一个。

相关内容

最新更新