MudBlazor MudSwitch组件：值变更时如何调用函数？

你的代码编译失败主要有三个问题：

• 同时使用@bind-Value和ValueChanged会冲突，Blazor自动绑定逻辑会覆盖手动指定的事件
• ValueChanged的委托签名不匹配，它需要接收bool类型参数，且返回Task而非Task<bool>
• 异步方法的调用方式不符合事件回调要求

下面是两种正确的实现方案：

方案一：手动处理 Value 和 ValueChanged（不使用 @bind-Value） #

<MudSwitch Value="@Switch1" ValueChanged="HandleSwitchChanged" Label="Info" Color="Color.Info" />

@code {
    private bool Switch1 { get; set; }

    private async Task HandleSwitchChanged(bool newValue)
    {
        Switch1 = newValue; // 手动更新绑定值
        // 调用你的业务逻辑函数
        await YourBusinessFunction();
    }

    private async Task YourBusinessFunction()
    {
        // 这里编写要执行的业务逻辑
    }
}

方案二：使用 @bind-Value:after（Blazor 6.0+ 支持） #

如果想保留@bind-Value的自动绑定特性，可以用@bind-Value:after指定值变更后的回调：

<MudSwitch @bind-Value="@Switch1" @bind-Value:after="HandleSwitchChanged" Label="Info" Color="Color.Info" />

@code {
    private bool Switch1 { get; set; }

    private async Task HandleSwitchChanged()
    {
        // 值已由Blazor自动更新，直接调用业务逻辑即可
        await YourBusinessFunction();
    }

    private async Task YourBusinessFunction()
    {
        // 这里编写要执行的业务逻辑
    }
}

关键说明 #

• 如果不需要异步操作，可将async Task改为void（同步场景）或保留Task
• 方案二中的@bind-Value:after会在Blazor自动更新Switch1的值后触发回调，无需手动赋值

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