# 前言
使用Element-ui Cascader
级联选择器,同时返回 value
和 label
# 使用ref定义myCascader
<el-cascader
style="width:99%;margin-top:10px;"
v-model="cates"
:options="options"
:props="props"
@change="handleChange"
ref="myCascader"
></el-cascader>
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
# 函数处理
handleChange(valueList) {
let labelList = this.$refs.myCascader.getCheckedNodes()[0].pathLabels;
this.form.oneCategoryId = valueList[0];
this.form.oneCategoryName = labelList[0];
this.form.twoCategoryId = valueList[1];
this.form.twoCategoryName = labelList[1];
}
1
2
3
4
5
6
7
2
3
4
5
6
7
# 断点调试
其中valueList
为value
值,labelList
为label
值
成功使用级联选择器同时返回vlaue
和label
值啦>_<.