關於mvvm的ComboBox繫結SelectedValue值不正確問題
阿新 • • 發佈:2019-02-15
我的自定義下拉物件
在viewModel中的繫結引數public class ComboBoxModel { //基礎屬性 public int SelectedIndex { get; set; } public string SelectedValue { get; set; } //附加屬性 public string ImagePath { get; set; } public bool IsSelected { get; set; } //碼錶屬性 public int Id { get; set; } public int SortNumber { get; set; } public int NodeKey { get; set; } public string NodeCode { get; set; } public string NodeName { get; set; } //建構函式 public ComboBoxModel() { SelectedIndex = 0; SelectedValue = null; } public ComboBoxModel(int index, string value) { SelectedIndex = index; SelectedValue = value; } }
public ObservableCollection<ComboBoxModel> CardType { get; set; }
public ComboBoxModel CardTypeSelected { get; set; }
前端頁面
<ComboBox Grid.Row="3" Grid.Column="4" VerticalAlignment="Center" VerticalContentAlignment="Center" ItemsSource="{Binding DataContent.CardType}" DisplayMemberPath="SelectedValue" SelectedValuePath="SelectedValue" SelectedIndex="{Binding DataContent.CardTypeSelected.SelectedIndex,Mode=TwoWay}" SelectedValue="{Binding DataContent.CardTypeSelected.SelectedValue,Mode=TwoWay}" />
我的ItemsSource繫結的是一個ComboBoxModel型別的物件列表,就是要告訴頁面我的下拉選單裡每個選項是什麼內容
ItemsSource="{Binding DataContent.CardType}"
這裡ObservableCollection<ComboBoxModel>和List<ComboBoxModel>意義相同,但是在MVVM裡前者可與頁面繫結互動,所以儘量用前者
在這個物件列表中的每一個選項本身是一個ComboBoxModel型別,且有兩個屬性:
SelectedIndex
SelectedValue
所以我需要明確告訴前端頁面我顯示的路徑是哪裡,選中引數的儲存路徑又是哪裡
DisplayMemberPath="SelectedValue" //顯示成員的路徑
SelectedValuePath="SelectedValue"//選中引數的路徑
所以在指定這兩項後,前端下拉選單才能正確的顯示ItemsSource的內容
如果不設定這兩個路徑,前端頁面就不知道這個自定義ComboBoxModel物件究竟要顯示什麼,很大可能性你得到的一個結果就是一長串ComboBoxModel的型別描述字串
然後就可以繫結具體的接收SelectedIndex和SelectedValue的引數了,例如:
SelectedIndex="{Binding DataContent.CardTypeSelected.SelectedIndex,Mode=TwoWay}"
SelectedValue="{Binding DataContent.CardTypeSelected.SelectedValue,Mode=TwoWay}"
因為設定了TwoWay,所以若你的上下文DataContent實現雙工介面的情況下就可以在後端更新前端資料了
public class ShowDialogEmployeeModel : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
public void OnChangedProperties(string propertyName) => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
上面程式碼是DataContent的雙工介面舉例