写此博客的原因:MAUI或者xamarin的基础教程提供的都是最基本的mvvm创建方式,实际上在企业级开发中,不易于使用。
1.基础创建方式:声明方式创建视图模型
最简单的方法是让视图在 XAML 中以声明方式实例化其对应的视图模型。当视图被构建时,相应的视图模型对象也会被构建。以下代码示例演示了此方法:
<ContentPage ... xmlns:local="clr-namespace:eShop">
<ContentPage.BindingContext>
<local:LoginViewModel />
</ContentPage.BindingContext>
...
</ContentPage>
2.编程方式创建视图模型
视图可以在代码隐藏文件中包含代码,从而将视图模型分配给其BindingContext属性。这通常在视图的构造函数中完成,如以下代码示例所示:
public LoginView()
{
InitializeComponent();
BindingContext = new LoginViewModel(navigationService);
}
一个具体的例子:
以下是在Maui中声明MVVM的方式:
创建一个ViewModel类,该类应该实现INotifyPropertyChanged
接口。例如:
public class MyViewModel : INotifyPropertyChanged
{
private string _myProperty;
public string MyProperty
{
get { return _myProperty; }
set
{
_myProperty = value;
OnPropertyChanged(nameof(MyProperty));
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
页面中设置BindingContext
属性为ViewModel的实例。例如:
public partial class MyPage : ContentPage
{
public MyPage()
{
InitializeComponent();
BindingContext = new MyViewModel();
}
}
XAML中使用Binding
来绑定控件的属性到ViewModel中的属性。例如:
<Label Text="{Binding MyProperty}" />
在ViewModel的MyProperty
属性发生变化时,绑定到该属性的控件将会自动更新
拓:INotifyPropertyChanged接口如何做到通知前端数据更改的
具体来说,当数据对象的属性值发生更改时,数据对象会调用OnPropertyChanged方法,并传递属性名称作为参数。这个方法会触发PropertyChanged事件,从而通知前端UI绑定机制进行更新。前端UI绑定机制会根据属性名称找到对应的UI元素,并更新它们的显示内容。
需要注意的是,为了使INotifyPropertyChanged接口生效,数据对象必须实现该接口,并在属性值更改时调用OnPropertyChanged方法。否则,前端UI绑定机制无法感知到数据更改,也就无法更新UI视图。