1.vue使用elementui的el-cascader

 npm install element-china-area-data -S //安装

//regionData 是省市区三级联动数据（不带“全部”选项）
//CodeToText 是个大对象，属性是区域码，属性值是汉字 用法例如：CodeToText[‘110000’]输出北京市
//TextToCode  后台省市区显示再页面转code，
//TextToCode['广东省'].code， TextToCode['广东省']['深圳市'].code,
//TextToCode['广东省']['深圳市']['福田区'].code,分别是省市区code

 <el-form-item label="所在区域" prop="area">
      <el-cascader
         :options="areaSelectData"
         @change="handleChange"
         class="full-width"
         size="large"
         v-model="form.selectedOptions"
         placeholder="请选择您所在的城市"
          />
  </el-form-item>


import { regionData, CodeToText, TextToCode } from "element-china-area-data";

data(){
  return{
     areaSelectData: regionData,//省市区三级联动数据
  }
}



  showEditDialog(row) {//showEditDialog为点击编辑数据显示的按钮
      this.getList();
      this.dialogConsignee = true;
      this.form.selectedOptions = [
        TextToCode[this.list.province].code,
        TextToCode[this.list.province][this.list.city].code,
        TextToCode[this.list.province][this.list.city][this.list.area].code,
      ];
    },



handleChange(value) {
      //value为省市区code数组
      if (value) {
        var provinceCode = CodeToText[value[0]];//code转为省
        var cityCode = CodeToText[value[1]];//市
        var orgion = CodeToText[value[2]];//区
        this.form.province = provinceCode;
        this.form.city = cityCode;
        this.form.area = orgion;
        // this.form.selectedOptions = provinceCode + cityCode + orgion;
      }
  },