vue+element Cascader 级联选择器 > 实现省市区三级联动
先看下实现效果吧（嘻嘻）
看完我们就开始啦
安装element-china-area-data1
npm install element-china-area-data@5.0.2 -S
文章来源：https://www.toymoban.com/news/detail-569747.html
上代码
<el-cascader
size="large"
:options="options"
v-model="selectedOptions"
@change="handleChange"
>
</el-cascader>
import { regionData, CodeToText } from "element-china-area-data";
handleChange(val) {
var loc = "";
for (let i = 0; i < this.selectedOptions.length; i++) {
loc += CodeToText[this.selectedOptions[i]] + "-";
}
let arr = [loc.split("-")[0], loc.split("-")[1], loc.split("-")[2]]
this.form.nativeplace = arr.join('')
}
完美（实现后别忘记动动小手点个赞哦~）
-
请安装指定版本的element-china-area-data(5.0.2)，否则可能会导致报错：CodeToText为undefined（我就遇到了（嘘），要注意哦~） ↩︎文章来源地址https://www.toymoban.com/news/detail-569747.html
到了这里，关于vue+element Cascader 级联选择器 ＞ 实现省市区三级联动的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
