(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

相关推荐
Asize8 分钟前
Node path 与 fs 模块:从回调地狱到 async await 的异步进化
javascript·node.js
VaJoy1 小时前
全面革新⚡️ Vue 3.6 项目工程的基础实现
前端·vue.js
大家的林语冰2 小时前
😭 Electron 麻了,Deno 直接支持二进制应用,无需第三方桌面应用框架!
前端·javascript·node.js
Ivanqhz2 小时前
NFM(神经因子分解机)
开发语言·javascript·人工智能·算法·蓝桥杯
用户298698530144 小时前
在 React 中拆分 Excel 文件:从工作表到行列的实践
javascript·react.js·excel
想要成为糕糕手4 小时前
238. 除了自身以外数组的乘积 — 面试向深度解析
javascript·算法·面试
kisshyshy4 小时前
前端存储、表单异步提交与 this 指向完全指南
前端·javascript·html
Kel4 小时前
管道、IPC、Socket:你以为的三种技术,其实是同一件事
javascript·设计模式·node.js
心中有国也有家4 小时前
AtomGit Flutter 鸿蒙客户端: AnimatedScale 与 AnimatedContainer 联合实战
android·javascript·flutter·华为·harmonyos
嘉泰姆半导体官方4 小时前
CXAR41337C 双通道数字音频功放 | 2×20W | EQ+DRC | I²S | MCLK-Less - 嘉泰姆电子
前端·javascript·数据库