Blazor对象内部修改属性值时数据绑定失效问题求助

你遇到的问题存在三个核心原因：

1. 未正确触发属性变更通知：原代码直接修改私有字段_name，即便实现INotifyPropertyChanged接口也不会触发变更事件；且你尝试过该接口但无效，大概率是没在属性赋值时正确触发通知逻辑。
2. 后台线程未切换至UI上下文：Blazor组件的状态更新必须在UI线程（同步上下文）中执行，后台线程直接修改属性无法触发组件重新渲染。
3. 无限循环无终止机制：start()里的while(true)会持续占用线程，引发资源泄漏问题。

1. 修改Student类，正确实现INotifyPropertyChanged并处理线程上下文 #

using System;
using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Threading;
using System.Threading.Tasks;

namespace blazor_winform_sample.Entity
{
    public class Student : INotifyPropertyChanged
    {
        private string _name = "";
        private CancellationTokenSource _cts;

        public string Name
        {
            get => _name;
            set
            {
                if (_name != value)
                {
                    _name = value;
                    OnPropertyChanged();
                }
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;

        protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }

        public async Task StartAsync(Action uiUpdateCallback)
        {
            // 取消之前的循环（若存在）
            _cts?.Cancel();
            _cts = new CancellationTokenSource();
            var token = _cts.Token;

            await Task.Run(async () =>
            {
                while (!token.IsCancellationRequested)
                {
                    // 通过属性赋值触发变更通知
                    Name = new Random().Next().ToString();
                    // 调用UI线程的更新回调
                    uiUpdateCallback?.Invoke();
                    await Task.Delay(500, token);
                }
            }, token);
        }

        // 提供停止方法，避免内存泄漏
        public void Stop()
        {
            _cts?.Cancel();
            _cts?.Dispose();
        }
    }
}

2. 修改Razor组件，适配线程上下文更新并处理组件生命周期 #

@page "/data-bind"
@using blazor_winform_sample.Entity
@implements IDisposable

<h3>data bind test</h3>

<div>
    <div>
        <button @onclick="Start">go!</button>
        <button @onclick="Stop">stop!</button>
        <label>@toast</label>
    </div>

    <input type="text" readonly @bind="Stu.Name" />
    <input type="text" @bind="@Stu.Name" />
    <input type="text" value="@Stu.Name" @onchange="@ChangeValue" />
</div>

@code {
    private Student Stu { get; set; } = new();
    private string toast = "";

    void ChangeValue(ChangeEventArgs e)
    {
        Stu.Name = "haha" + e?.Value?.ToString();
    }

    private async Task Start()
    {
        toast = "start button clicked!";
        // 传入UI线程更新回调，强制组件重新渲染
        await Stu.StartAsync(() => InvokeAsync(StateHasChanged));
    }

    private void Stop()
    {
        Stu.Stop();
        toast = "stopped!";
    }

    // 组件销毁时停止循环，释放资源
    public void Dispose()
    {
        Stu.Stop();
    }
}

• 属性变更通知：通过Name属性的setter触发PropertyChanged事件，确保属性变更能被Blazor绑定系统捕获。
• UI线程同步：通过InvokeAsync(StateHasChanged)强制Blazor在UI线程重新渲染组件，解决后台线程无法触发更新的问题。
• 资源管理：添加CancellationTokenSource控制循环终止，并在组件销毁时调用Stop()释放资源，避免内存泄漏。

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