(vue)el-checkbox 实现展示区分 label 和 value(展示值与选中获取值需不同)

(vue)el-checkbox 实现展示区分 label 和 value(展示值与选中获取值需不同)


后端数据


解决方法

在 el-checkbox 标签中间传入要展示的文本即可,代码如下:

c 复制代码
<el-checkbox-group
  v-model="formInline.processFieldList"
  @change="handleChecked"
>
  <el-checkbox
    v-for="(item,index) in ziduanOptions"
    :key="index"
    :label="item.projectName" //真实获取的值
  >{{ item.projectAbbrName }}</el-checkbox> //展示值
</el-checkbox-group>

解决参考:https://blog.csdn.net/jiangjunyuan168/article/details/135827230

相关推荐
热忱112830 分钟前
elementUI Table组件实现表头吸顶效果
前端·vue.js·elementui
w(゚Д゚)w吓洗宝宝了1 小时前
单例模式 - 单例模式的实现与应用
开发语言·javascript·单例模式
大叔_爱编程1 小时前
wx035基于springboot+vue+uniapp的校园二手交易小程序
vue.js·spring boot·小程序·uni-app·毕业设计·源码·课程设计
zhaocarbon1 小时前
VUE elTree 无子级 隐藏展开图标
前端·javascript·vue.js
小周不摆烂3 小时前
探索JavaScript前端开发:开启交互之门的神奇钥匙(二)
javascript
匹马夕阳4 小时前
Vue 3中导航守卫(Navigation Guard)结合Axios实现token认证机制
前端·javascript·vue.js
你熬夜了吗?4 小时前
日历热力图,月度数据可视化图表(日活跃图、格子图)vue组件
前端·vue.js·信息可视化
我想学LINUX5 小时前
【2024年华为OD机试】 (A卷,100分)- 微服务的集成测试(JavaScript&Java & Python&C/C++)
java·c语言·javascript·python·华为od·微服务·集成测试
screct_demo5 小时前
詳細講一下在RN(ReactNative)中,6個比較常用的組件以及詳細的用法
javascript·react native·react.js
CodeClimb11 小时前
【华为OD-E卷 - 第k个排列 100分(python、java、c++、js、c)】
java·javascript·c++·python·华为od