2018-8-10-WPF-省市县3级联动

title	author	date	CreateTime	categories
WPF 省市县3级联动	lindexi	2018-08-10 19:16:53 +0800	2018-2-13 17:23:3 +0800	WPF

本文告诉大家如何使用绑定做省市县3级联动，代码从网上找的。

首先定义显示的类，包括 id 和 名称

    public class CodeView
    {
        public string Id { get; set; }

        public string Name { get; set; }
    }

然后定义省市县的数据

    public class Province: CodeView
    {
        public List<City> Child { get; set; }
    }

    public class City: CodeView
    {
        public List<County> Child { get; set; }
    }

    public class County:CodeView
    {

    }

因为可以通过 xaml 绑定 选择的元素，所以可以绑定选择的列

请看前台代码，最重要的是通过省选择的元素来作为下一级的数据，于是选择第一个修改时，就会自动联动

    <Grid Name="Content">
        <Grid.Resources>
            <Style TargetType="ComboBox" BasedOn="{StaticResource {x:Type ComboBox}}">
                <Setter Property="Margin" Value="0 0 10 0"></Setter>
                <Setter Property="MinWidth" Value="60"></Setter>
            </Style>
        </Grid.Resources>
        <Grid.ColumnDefinitions>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
            <ColumnDefinition></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <ComboBox Grid.Column="0" ItemsSource="{Binding Path=Provinces}" x:Name="ComboBoxProvince" 
                  DisplayMemberPath="Name" SelectedValuePath="Id" SelectedValue="{Binding Path=Province,Mode=TwoWay}">
        </ComboBox>
        <ComboBox Grid.Column="1" x:Name="ComboBoxCity" ItemsSource="{Binding Path=SelectedItem.Child,ElementName=ComboBoxProvince}" 
                  DisplayMemberPath="Name" SelectedValuePath="Id" SelectedValue="{Binding Path=City,Mode=TwoWay}" ></ComboBox>
        <ComboBox Grid.Column="2" x:Name="ComboBoxCounty" ItemsSource="{Binding Path=SelectedItem.Child,ElementName=ComboBoxCity}"
                  DisplayMemberPath="Name" SelectedValuePath="Id" SelectedValue="{Binding Path=County,Mode=TwoWay}"></ComboBox>
    </Grid>

可以看到ItemsSource="{Binding Path=SelectedItem.Child,ElementName=ComboBoxProvince}"绑定了上一级选择的元素，所以就可以联动。

DisplayMemberPath 就是显示的值，所以就可以显示列表是城市的名称。

后台代码需要定义几个属性

   public partial class AreaSelect : UserControl, INotifyPropertyChanged
    {

        private IList<Province> _provinces = new List<Province>();

        public static readonly DependencyProperty ProvinceProperty = DependencyProperty.Register("Province", typeof(string), typeof(AreaSelect), new FrameworkPropertyMetadata(string.Empty));
        public static readonly DependencyProperty CityProperty = DependencyProperty.Register("City", typeof(string), typeof(AreaSelect), new FrameworkPropertyMetadata(string.Empty));
        public static readonly DependencyProperty CountyProperty = DependencyProperty.Register("County", typeof(string), typeof(AreaSelect), new FrameworkPropertyMetadata(string.Empty));


        public IList<Province> Provinces
        {
            get
            {
                return _provinces;
            }
            set
            {
                _provinces.Clear();
                if (value != null)
                {
                    foreach (Province province in value)
                    {
                        _provinces.Add(province);
                    }
                }
            }
        }
        
        public AreaSelect()
        {
            InitializeComponent();
            this.Content.DataContext = this;
            this.PropertyChanged += SelectedArea_PropertyChanged;
        }

        private void SelectedArea_PropertyChanged(object sender, PropertyChangedEventArgs e)
        {
            Console.WriteLine(Province + " " + City + " " + County);
        }


        private string _province;
        private string _city;
        private string _county;

        public string Province
        {
            get { return _province; }
            set
            {
                _province = value;
                _city = string.Empty;
                if (PropertyChanged != null)
                {
                    PropertyChanged.Invoke(this, new PropertyChangedEventArgs("Province"));
                }
            }
        }
        public string City
        {
            get { return _city; }
            set
            {
                _city = value;
                _county = string.Empty;
                if (PropertyChanged != null)
                {
                    PropertyChanged.Invoke(this, new PropertyChangedEventArgs("City"));
                }
            }
        }
        public string County
        {
            get { return _county; }
            set
            {
                _county = value;
                if (PropertyChanged != null)
                {
                    PropertyChanged.Invoke(this, new PropertyChangedEventArgs("County"));
                }
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;
    }

数据：省市区

感谢 Baolaitong 提供代码