Blazor 按钮事件触发多次答案

【问题标题】：Blazor button event firing multiple timesBlazor 按钮事件触发多次
【发布时间】：2020-04-24 19:48:13
【问题描述】：

我有一个 Blazor 应用程序，其中按下时会触发一个按钮事件。问题是每次按下按钮时都会触发 3 次事件。我只是注意到，如果我按 Enter 而不是单击按钮，则事件只会触发一次。（而且我真的不知道为什么......）

这是按钮，如果需要，还有一些 html：

    <div class="form-container uk-flex uk-flex-column uk-flex-middle">
        <span class="input-container">
            <input type="text" name="verb" id="form_verb" @bind="searchInput" />
        </span>
        <!-- This is the button -->
        <button type="button" class="uk-button uk-button-secondary" style="width:40%; margin-top:0.25rem;" @onclick="@Search">Lorem ipsum</button>
    </div>
    <h1>@counter</h1>

这是触发的事件：

private async Task Search()
{
    counter = counter + 1;
    navigatableSearchInput = searchInput;
    await tablaReconocimientos.SearchVerb(searchInput);
}

这里有一个发生了什么的例子：

EDIT_1：将@onclick 事件更改为@onclick="@Search"。相同的行为。

EDIT_2：添加了按回车行为。

EDIT_3：用于按钮说明的标记

【问题讨论】：

您的示例对细节有点轻描淡写，但您能否将您的按钮点击处理程序更改为 @onclick="@Search" 并用结果更新您的问题？
刚刚更新了您的请求。行为仍然是相同的。我还能在这里写什么来给你更多信息？几乎就是页面中的所有代码。
在我看来，每次页面呈现/更新和真正的点击时按钮都会触发。你能附上你的按钮代码吗？
@Taladan 按钮的代码在上面，触发的事件也是如此。你说的是那个吗？编辑按钮组件处的标记。

标签： c# events blazor blazor-server-side

【解决方案1】：

正如上面提到的@Taladan，每次渲染或更新页面时都会调用该函数。我只是没有注意到我在OnAfterRender() 中留下了对该函数的调用。我只是将那部分更改为在OnParametersSet() 中调用，并且工作起来就像一个魅力。

我有这个：

protected override void OnAfterRender(bool firstRender)
{
    if (searchInput != null) Search();
}

刚刚改成这个

protected override Task OnParametersSetAsync()
{
    if (searchInput != null) Search();
    return base.OnParametersSetAsync();
}

【讨论】：

请注意，如果您使用 OnAfterRender(bool firstRender) 您可以使用 if(firstRender){...} 将代码包装在此方法中，它应该可以防止不断重新加载。