响应式网站研究现状,建网站报价明细表,什么网站个人可以建设,百度浏览器网站入口各位大佬#xff0c;有时我们在处理级联选择组件数据时#xff0c;不仅需要拿到id,还需要拿到label名称#xff0c;但是通常组件直接绑定的是id,所以就需要我们用别的方法去拿到label,此处官方是有这个方法的#xff0c;具体根据不同的element 版本进行分别处理。
VUE3 e…各位大佬有时我们在处理级联选择组件数据时不仅需要拿到id,还需要拿到label名称但是通常组件直接绑定的是id,所以就需要我们用别的方法去拿到label,此处官方是有这个方法的具体根据不同的element 版本进行分别处理。
VUE3 element3.x版本处理办法
主要分为3个步骤 1、template部分增加ref名称和change事件 2、获取ref 3、change事件直接获取label名称并赋值
1、template部分
el-form-item :labelasides[articleOrg].name ?? $t(article.articleOrg) requiredel-cascader v-modelvalues.articleOrg :optionsorgList refarticleOrgRef changehandleChangeclassw-full :propsprops1 clearable //el-form-item// 只需要在你的代码上给级联组件增加ref名称即可随意起的您怎么开心怎么来哈哈2、获取Ref
import { ref } from vue;
const articleOrgRef ref(null)3、change事件直接获取label名称并赋值
const handleChange () {console.log(label,articleOrgRef.value.getCheckedNodes()[0].label)// 我这里只是打印了一下label的值哦需要赋值的话自己去赋值哦
}VUE2 element2.x
获取el-cascader级联选择器选中的当前结点的label值此处引用大佬的文章可以去看下 获取el-cascader级联选择器选中的当前结点的label值