Vue+Element UI 实现省市区数据联动

1.安装

npm install element-china-area-data -S

2.在组件中使用（以省市二级数据联动为例）

import { provinceAndCityData, regionData, provinceAndCityDataPlus, regionDataPlus, CodeToText, TextToCode } from 'element-china-area-data'

/*
provinceAndCityData是省市二级联动数据（不带“全部”选项）
regionData是省市区三级联动数据（不带“全部”选项）
provinceAndCityDataPlus是省市区三级联动数据（带“全部”选项）
regionDataPlus是省市区三级联动数据（带“全部”选项）
*/

data() {
    return {
      addressData: provinceAndCityData,
      selectedAddress: [],
    };
  }

//拿到选择的省与城市
methods: {
    getAddress(value) { //value是长度为2的装有被选择省、市代码的数组;CodeToText是个对象，键名为代码，键值为省和城市
      this.selectedAddress = [];
      for (let i = 0; i < value.length; i++) {
        let code = value[i];
        this.selectedAddress.push(CodeToText[code]);
      }
      console.log(this.selectedAddress); //["河北省","唐山市"]
    }
}