У родительского / дочернего компонента проблемы обратного вызова события Blazor "нет свойства, соответствующего имени OnClickCallback" " - PullRequest
3 голосов
/ 09 июля 2020

Проблема

Итак, у меня проблема в Blazor, когда я пытаюсь вызвать метод в родительском компоненте MainLayout из дочернего компонента (NavMenu). Все, что я пытаюсь достичь, - это открыть диалоговое окно в родительском компоненте MainLayout после того, как мне было предложено с помощью кнопки в дочернем компоненте NavMenu. то же самое для NavMenu и MainLayout.

Что я пробовал

Я следил за Microsoft Docs Here , и я не могу заставить это работать вообще. Я надеюсь, что делаю что-то глупо , и бесплатная sh пара глаз может обнаружить проблему.

Текущий результат

В основном , все работает нормально, но когда я go запускаю приложение, в веб-консоли отображается следующая ошибка:

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

Код

Родительский компонент (MainLayout)

<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
    }
}

Дочерний компонент (NavMenu)

<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 " что на самом деле sol обнаружил проблему, с которой я столкнулся позже.

Мой дочерний компонент теперь также использует:

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

Для вызова обратного вызова в родительском компоненте, который, в свою очередь, теперь открывает мои диалог, как и ожидалось.

Спасибо всем, кто помог, это признательно.

1 Ответ

1 голос
/ 09 июля 2020

Ошибка довольно буквальная:

... .NavMenu 'не имеет свойства, соответствующего имени' OnClickCallback '.

Таким образом, ошибка не соответствовать вашему коду. У дочернего компонента NavMenu есть это свойство параметра.

Вы должны использовать <NavMenu OnClickCallback="Foo">, no @ или (), но это не может объяснить эту ошибку.

Лучшее предположение - что у вас есть Два компонента называются <NavMenu>, и вы смотрите не на тот.

...