Element-ui中的省市区级联选择器

下载安装

npm install element-china-area-data -S

导入

以vue-cli项目为例，引入到script标签中

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

代码展示

<template>
    <div class="main-box">
         <el-cascader
            size="large"
            :options="options"
            v-model="selectedOptions"
            @change="handleChange">
          </el-cascader>
    </div>
</template>
<script>
import { regionData, CodeToText } from "element-china-area-data";
export default {

data(){
    return {
          options: regionData,
          selectedOptions: [],
    }
},
methods:{
        handleChange() {
      var loc = "";
      for (let i = 0; i < this.selectedOptions.length; i++) {
        loc += CodeToText[this.selectedOptions[i]];
      }
 
    }
}
}


</script>

效果展示