c# - 插入后不会立即更改 Blazor 文本

Question

我有一个应用程序，用户可以在其中在某个位置插入文本。文本显示在同一页面的徽章上。我想要的是，当用户键入时，更改会立即显示在徽章中。我添加了一个 oninput 事件，但似乎 oninput 事件没有更新剃刀页面，因为当我有输入更改时徽章保持空白。只有在 TextField 上失去焦点时才会显示文本。

我怎样才能做到当我插入字母时，它们会立即显示在徽章上？

文本输入：

<MudTextField @bind-Value="@itemAttribute.Title" @oninput="(e)=> itemAttribute.Title = e.Value.ToString()" />

徽章：

<MudBadge Overlap="false" Style="@($"color: #CFD8DC;")" Color="Color.Transparent" Content="@itemAttribute.Title">

多变的：

 [Parameter] public ItemAttribute itemAttribute { get; set; }

Answer 1

尝试简单：

<MudTextField @bind-Value="@itemAttribute.Title" Immediate="true" />

Answer 2

你应该使用StateHasChanged方法。该StateHasChanged方法通知组件其状态已更改。如果适用，这将导致组件重新渲染。

你可以试试这段代码：

文本输入：

<MudTextField @bind-Value="@itemAttribute.Title" @oninput="()=> UpdateBadge()" />

徽章：

<MudBadge @bind-Value="@BadgeContent.Title" Overlap="false" Style="@($"color: #CFD8DC;")" Color="Color.Transparent" Content="@itemAttribute.Title">

代码：

[Parameter] public ItemAttribute itemAttribute { get; set; }
[Parameter] public ItemAttribute BadgeContent { get; set; }

private void UpdateBadge()
{
   BadgeContent.Title = itemAttribute.Title;
   StateHasChanged();
}