UWP MVVM模式下ComboBox无法返回选中值问题求助

问题描述 #

在UWP应用的MVVM模式中使用ComboBox时遇到空引用异常：此前通过代码后置方式可正常获取选中值，但改用ViewModel后始终触发空引用异常，无法将ComboBox的选中值传递到业务代码中。

代码后置正常实现方式 #

private void WireUpSpelerDropDown()
{
    string sql = "select * from Golfclub ";
    var golfclublijst = SqliteDataAccess.LoadData<GolfclubModel>(sql, new Dictionary<string, object>());

    golfclublijst.ForEach(x => golfclub.Add(x));

    golfclubDropDown.ItemsSource = golfclub;
    golfclubDropDown.DisplayMemberPath = "Naam";
    golfclubDropDown.SelectedValuePath = "Id";
}

MVVM模式下的ViewModel代码 #

public class SpelerViewModel : INotifyPropertyChanged
{
    public ObservableCollection<SpelerModel> Spelers = new ObservableCollection<SpelerModel>();
    public ObservableCollection<GolfclubModel> Golfclubs = new ObservableCollection<GolfclubModel>();
    
    public bool NewRecordClearFields = false;

    public int GolfclubId { get; set; } = 3;

    public SpelerModel NewSpeler { get; set; }
    public SpelerViewModel()
    {
        NewSpeler = new SpelerModel();
        GetData();
        WireUpSpelerDropDown();
    }
    private void WireUpSpelerDropDown()
    {
       
        string sql = "select * from Golfclub ";
        var golfclublijst = SqliteDataAccess.LoadData<GolfclubModel>(sql, new Dictionary<string, object>());

        golfclublijst.ForEach(x => Golfclubs.Add(x));
    }

    // 原代码可能缺失的INotifyPropertyChanged接口实现
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

XAML代码 #

<ComboBox x:Name="golfclubDropDown" 
          ItemsSource="{x:Bind Viewmodel.Golfclubs, Mode=OneWay}"                          
          SelectedValue="{x:Bind Viewmodel.GolfclubId, Mode=TwoWay}"
          DisplayMemberPath="Naam"
          SelectedValuePath="Id"
          Header="Homeclub"
          Margin="8"
          MinWidth="200">
</ComboBox>

解决方案 #

• 将ViewModel中的集合字段改为属性：x:Bind默认只支持绑定属性而非字段，把集合定义改为自动属性才能让绑定正常识别：

  public ObservableCollection<SpelerModel> Spelers { get; } = new ObservableCollection<SpelerModel>();
  public ObservableCollection<GolfclubModel> Golfclubs { get; } = new ObservableCollection<GolfclubModel>();
  

• 为GolfclubId添加属性变更通知：双向绑定依赖INotifyPropertyChanged接口触发通知，修改属性实现确保值变化时通知UI：

  private int _golfclubId = 3;
  public int GolfclubId 
  { 
      get => _golfclubId; 
      set 
      {
          if (_golfclubId != value)
          {
              _golfclubId = value;
              OnPropertyChanged();
          }
      } 
  }
  

• 确保页面ViewModel实例已初始化：在页面构造函数中创建ViewModel实例，避免Viewmodel为空导致绑定失败：

  public YourPage()
  {
      this.InitializeComponent();
      Viewmodel = new SpelerViewModel();
  }
  

• 补全INotifyPropertyChanged接口实现：ViewModel必须完整实现PropertyChanged事件及触发方法，否则属性变更无法通知UI（如ViewModel代码示例中补充的部分）。

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