element-ui中的中国省市区级联选择器 ElementUI

文章目录

安装
导入
使用
效果

以下教程参考自官方的教程：https://www.npmjs.com/package/element-china-area-data
安装

执行以下语句安装城市数据：

npm install element-china-area-data -S

导入

以vue-cli创建的项目为例，在vue文件中的scrit标签内导入数据：

文章图片

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

使用

如下代码所示：

> import { regionData, CodeToText } from "element-china-area-data"; export default { name: "app", data() { return { options: regionData, selectedOptions: [] }; },methods: { handleChange() { var loc = ""; for (let i = 0; i < this.selectedOptions.length; i++) { loc += CodeToText[this.selectedOptions[i]]; } alert(loc); } } };

效果