0
点赞
收藏
分享

微信扫一扫

ElementUI使用Cascader实现省市区三级联动


效果图

ElementUI使用Cascader实现省市区三级联动_github


省市区的Json数据

​​下载链接​​

<script src="https://cdn.suoluomei.com/common/js2.0/city-data/city-data.js"></script>

省市区的Json格式

ElementUI使用Cascader实现省市区三级联动_json格式_02


也可以去github下载​​省市区的JSON格式​​

<el-cascader v-model="area" :options="areaList" :props="optionProps" filterable 
ref="myCascader"></el-cascader>
<script>data() {
return {
areaList: rawCitiesData,
area: [],
optionProps: { //配置节点
value: 'code',
label: 'name',
children: 'sub'
},
}
}</script>

如果需要打印Cascader组件的label
使用ref

this.$refs.myCascader[0].inputValue


举报

相关推荐

0 条评论