ASP.NET Core Blazor：@bind-Value无法更新字段问题求助

原因 #

你的Blazor组件当前采用静态渲染模式，这种模式下不会处理用户输入的双向绑定交互逻辑，输入框的修改无法同步到userInput对象，导致提交时获取的仍是初始值。

解决方法 #

有两种简单的方式启用交互式服务器渲染，让双向绑定正常工作：

方式1：给当前页面单独启用交互式渲染 #

在页面的@page指令下方添加@rendermode InteractiveServer，修改后的页面代码如下：

@page "/simpleform"
@rendermode InteractiveServer

<PageTitle>TestPage</PageTitle>
<h3>Einfaches Formular</h3>

<EditForm Model="userInput" OnValidSubmit="HandleSubmit" FormName="test">
    <DataAnnotationsValidator />
    <ValidationSummary />

    <div class="form-group">
        <label for="inputText">Text eingeben</label>
        <InputText id="inputText" class="form-control" @bind-Value="userInput.InputText" />
    </div>

    <button type="submit" class="btn btn-primary">Absenden</button>
</EditForm>


@if (submittedText != null)
{
    <p>Du hast eingegeben: @submittedText</p>
}

@code {
    private UserInputModel userInput = new UserInputModel();
    private string? submittedText;

    protected override void OnInitialized()
    {
        userInput.InputText = "Hello World!";
    }

    private void HandleSubmit()
    {
        submittedText = userInput.InputText;
    }

    public class UserInputModel
    {
        public string? InputText { get; set; }
    }
}

方式2：设置全局默认交互式渲染模式 #

如果希望所有组件都使用交互式服务器渲染，可修改App.razor中的RouteView，添加RenderMode="InteractiveServer"：

<RouteView RouteData="@RouteData" DefaultLayout="@typeof(MainLayout)" RenderMode="InteractiveServer" />

验证 #

修改后，组件会以交互式服务器模式运行，输入框的内容会实时同步到userInput对象，提交表单时就能正确获取到更新后的输入值。

内容的提问来源于stack exchange，提问作者nicesbrot