element-UI级联选择器(Cascader)获取label值

最新推荐文章于 2025-03-03 16:29:59 发布

小唐爱分享

最新推荐文章于 2025-03-03 16:29:59 发布

阅读量2.1k

点赞数

文章标签： vue js javascript

本文链接：https://blog.youkuaiyun.com/qq_32406257/article/details/106409967

版权

本文介绍如何在Element-UI的Cascader组件中获取选中节点的label值，特别是最后一级节点的label。通过监听选中节点的变化，可以定制化获取所需信息。注意emitPath参数的使用，当其为false时，返回的将是单个节点的值。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!--组件-->
<el-cascader
                            ref="cascaderDay"
                            @change = "changeDayValue"
                            v-model="dayWorkerLocation"
                            :options="allPersonTree"
                            clearable
                            :props="{ expandTrigger: 'hover',multiple: true,emitPath: false}"
                            :show-all-levels="false"></el-cascader>

//方法
 changeDayValue: function(nowData) {
                    var labelList = [];
                    var checkLabels = this.$refs['cascaderDay'].getCheckedNodes();
                    checkLabels.forEach(function(item) {
                        if(!item.hasChildren) {
                            labelList.push(item.label);
                        }
                    })
                    this.form.dayWorkerLocation =