【转】elementui 获取el-options的value和label
elementui 获取 value el Label Options
2023-09-11 14:22:19 时间
有个需求是 获取el-options的value和label
看到这篇文章,特意copy过来
原文:vue elementUI el-select 同时获取label 和 value 的值.
前端调用后端接口时,后端保存数据,有时需要前端提交select选择的 lable(name)和 value(code),所以我们需要想办法解决,怎么同时获取lable和value。 解决办法: el-option 绑定value的时候,同时绑定lable和value(分隔符隔开自定义一下就行)。这样 el-select v-model 绑定的最终值是 lable 和 value,我们在提交的时候,把v-model绑定的值(字符串),分割成数组。数组的下标0是lable,下标1是value。
<el-select v-model="selectValue" placeholder="请选择" size="small"> <el-option v-for="item in list" :key="item.value" :label="item.lable" :value="`${item.lable}|${item.vaue}`"> </el-option> </el-select>
在获取的时候
let [lable,vaue] = this.selectValue.split('|') // es6 数组解构赋值
相关文章
- VUE中使用ElementUI messageBox的使用
- elementui el-drawer去除自带黑色边框、允许滚动(亲测有效)
- vue elementUI表单输入时触发事件@input
- elementui 分页el-pagination遇到的所有坑(current失效、分页组件不显示、视图不改变等)
- 单独修改设置某一个elementui 元素的样式
- 修改elementui 的默认样式element.style样式
- 修改elementui 里面input的placeholder字体颜色
- vue3怎样使用elementui?用elementui 的新版本element-plus即可
- 设置ElementUI table标签只展示2个层级
- brython 开发前端页面之挑战 elementui第一天
- ElementUI+VUE 在使用ElementUI日期选择器时大于当前月份的日期不可选,默认日期
- 【项目实战】前端基于ElementUI实现对提交的附件大小进行控制