安装

地区选择器基于element-ui的el-cascader组件进行封装，所以在使用前请确保已经安装了element-ui。

要使用地区选择器,需额外安装element-china-area-data包。

npm install element-china-area-data --save

使用

在Vue组件中使用:

<template>
  <div>
    <el-cascader
      v-model="selectedOptions"
      style="width: 25%;"
      size="large"
      :options="options"
      @change="handleChange">
    </el-cascader>
  </div>
</template>

<script>
  import { regionData, CodeToText } from 'element-china-area-data'
  
  export default {
    data() {
      return {
        // 地区选择器选项
        options: regionData,
        // 地区选择器选中的值
        selectedOptions: [],
      }
    },
    methods: {
      // 地区选择器回调
      handleChange() {
        let loc = ''
        for (let i = 0; i < this.selectedOptions.length; i++) {
          loc += CodeToText[this.selectedOptions[i]] + ' '
        }
        // loc为选中的地区
      },
    }
  }
</script>