elementui Cascader 级联选择器 省市区联动

安装

cnpm install element-china-area-data --save

在页面中引入

import { cities ,CodeToText} from 'element-china-area-data'

组件使用

<el-cascader 
v-model="areaArr"
:options="options"
:props="{ expandTrigger: 'hover' }"
@change="chooseArea">
</el-cascader>

data节点选项

data(){
  return{
     options: cities,
  }

}

methods节点选项

chooseArea(value) {//区域地址改变
        console.log('chooseArea ==> ', value)//展示的你选择的值 是一个areaCode
        console.log(CodeToText[value[0]], CodeToText[value[1]], CodeToText[value[2]]); ///areaCode 对应的省市区 建议添加的时候 一定要保存 areaCode 用于编辑的时候
  },