如何在.NET MAUI的MVVM模式下通过x:Name操作组件

在MVVM模式里，ViewModel直接操作View控件是违背设计原则的，正确的做法是通过绑定属性来控制控件状态，具体步骤如下：

1. 在ViewModel中添加可观察属性 #

利用CommunityToolkit.Mvvm的ObservableProperty特性，添加一个控制按钮启用状态的属性：

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;
using CommunityToolkit.Maui.Alerts;

public partial class LoginViewModel : ObservableObject
{
    // 假设你已经定义了Email和Password属性
    [ObservableProperty]
    private string _email;

    [ObservableProperty]
    private string _password;

    // 新增：控制按钮启用状态的属性，初始值设为true（按钮默认启用）
    [ObservableProperty]
    private bool _isLoginButtonEnabled = true;

    [RelayCommand]
    async Task Login()
    {
        if (string.IsNullOrWhiteSpace(Email) || string.IsNullOrWhiteSpace(Password))
            return;

        // 点击后立即禁用按钮，防止重复提交
        IsLoginButtonEnabled = false;

        try
        {
            // 这里编写你的登录逻辑，比如调用后端API验证
            // await YourAuthService.LoginAsync(Email, Password);
            
            // 登录成功后的操作，例如跳转到主页面
            await Shell.Current.GoToAsync("//MainPage");
        }
        catch (Exception ex)
        {
            // 登录失败时显示错误提示
            await Toast.Make($"登录失败：{ex.Message}").Show();
        }
        finally
        {
            // 不管成功还是失败，最终恢复按钮可点击状态
            IsLoginButtonEnabled = true;
        }
    }
}

2. 修改XAML绑定按钮的IsEnabled属性 #

把Button的IsEnabled属性绑定到ViewModel的IsLoginButtonEnabled：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="Ventas_Citel.Views.Login.Login"
         xmlns:viewmodel="clr-namespace:Sales.ViewModels.Login"
         Title="">
<VerticalStackLayout>
   <!-- ... 其他登录表单元素 ... -->
   
    <Button Text="Log In" WidthRequest="200" CornerRadius="5" HorizontalOptions="Center" 
            Command="{Binding LoginCommand}" 
            IsEnabled="{Binding IsLoginButtonEnabled}"
            x:Name="loginButton"/>

   <!-- ... 其他登录表单元素 ... -->
</VerticalStackLayout>
</ContentPage>

为什么不能直接在ViewModel访问控件？ #

MVVM的核心是视图(View)和业务逻辑(ViewModel)分离，ViewModel不应该依赖任何具体的UI控件：

• 代码更易单元测试（无需依赖UI环境即可验证登录逻辑）
• 视图与逻辑解耦，后续更换UI控件或样式时无需修改ViewModel
• 符合MVVM模式设计初衷，让代码结构更清晰、可维护

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