您的位置:首页 > 产品设计 > UI/UE

关于mvvm的ComboBox绑定SelectedValue值不正确问题

2017-10-13 19:20 417 查看
我的自定义下拉对象

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;
}

}
在viewModel中的绑定参数

        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的双工接口举例
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: