vue插件使用之城市级联器

pc.d

发布于 2019.03.09 11:24 阅读 2988 评论 0

问题:

写菜篮子管理系统时,创建门店时需要填写地址(涉及省市区),自己用级联选择器做的话数据太多。

使用方法:

1.安装:

npm install element-china-area-data -S

2.引入 

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

3.使用

//省市区三级联动
<template>
  <div id="app">
    <el-cascader
      size="large"
      :options="options"
      v-model="selectedOptions"
      @change="handleChange">
    </el-cascader>
  </div>
</template>

<script>
  import { regionData } from 'element-china-area-data'
  export default {
    data () {
      return {
        options: regionData,
        selectedOptions: []
      }
    },

    methods: {
      handleChange (value) {
        console.log(value)
      }
    }
  }
</script>

参考地址:

https://github.com/Plortinus/element-china-area-data