Blazor 如何将 bind-value:event="oninput" 与 @oninput="FooFunc" 一起使用

Question

我正在使用 Blazor 服务器端。

我有几个绑定到不同值的输入框，但是只要有输入，它们就必须调用相同的函数。该函数本质上会启动计时器，该计时器旨在在经过 X 时间后保存数据。

Summary: <input class="summary-input @Utilities.SummaryWarning" type="text" @ref="Utilities.CreateSummaryRef" placeholder="Describe summary of an issue." @bind="Utilities.CurrentlyViewedProblem.SummaryText" @oninput="RestartSaveTimer">

我的问题是，使用此代码，输入框的行为不像oninput，而是更多的onchange. 在框失去焦点之前，不会绑定该值。但是每次击键都会启动计时器。所以我想要的结果是在击键时绑定值，并在击键时启动计时器。

我能想到的唯一方法是为每个将手动更新值的框创建单独的 RestartSaveTimer 方法，但在我的情况下，这是不希望的，因为输入框是根据数据大小动态填充的。

我试着添加@bind:event="oninput"它。但它抱怨oninput使用了两次或更多次。

请记住，我有多个这些行bind绑定到不同的属性，但它们都必须调用相同的RestartSaveTimer

编辑

所以其他框由 for 循环填充

@foreach (Solution solution in Utilities.CurrentlyViewedProblem.SolutionsList)
{
    <div class= "solution">
        <textarea class="solution-input" placeholder="Describe solution to an issue." @bind="solution.SolutionText" @oninput="((ChangeEventArgs e) => CheckSolutionRestartTimer(e, solution))"></textarea>
        <div class="vote">
            <button class="vote-button" @onclick="@(() => IncrementVote(solution))"></button>
            <div class="vote-label">@solution.Votes</div>
        </div>
    </div>
    <div class="date-box-solution">
        <div class="date-created"> Created on: @solution.Created.ToLocalTime()</div>
        <div class="date-modified"> Last Modified On: @solution.LastModified.ToLocalTime()</div>
    </div>
}

Answer 1

我找到了解决我的问题的方法。所以我会为任何有类似问题的人发帖。我在这里找到了答案https://github.com/dotnet/aspnetcore/issues/11178

解决方案是使用不同的处理程序。

<input class="summary-input @Utilities.SummaryWarning" type="text" @ref="Utilities.CreateSummaryRef" placeholder="Describe summary of an issue." @bind-value="Utilities.CurrentlyViewedProblem.SummaryText" @bind-value:event="oninput" @onkeyup="@RestartSaveTimer">

正如你可以通过在这里看到我绑定值输入@bind-value="ValueName"，@bind-value:event="oninput"绑定值，当我把输入。并@onkeyup="@Funcname"在释放键时调用我的函数。不完全理想，我更喜欢如果你可以有多个处理程序来处理像oninput. 但就我的目的而言，它完美无缺。