Element-ui 多选框使用问题

最新推荐文章于 2024-05-29 15:51:40 发布

晓_枫

最新推荐文章于 2024-05-29 15:51:40 发布

阅读量501

点赞数

分类专栏： vue elementUI 文章标签： vue.js elementui checkbox

本文链接：https://blog.csdn.net/qq_18676843/article/details/120127937

版权

vue 同时被 2 个专栏收录

19 篇文章 0 订阅

订阅专栏

elementUI

2 篇文章 0 订阅

订阅专栏

本文主要介绍了在Vue中使用el-checkbox-group和el-checkbox组件时遇到的两个常见问题：1. 数据未定义导致的'length'属性错误，解决方案是确保data[item.key]为数组；2. 选中问题，解决关键是设置正确的label属性，确保其为字符串类型，并正确显示选项值。

摘要由CSDN通过智能技术生成

参考文章：

CSDN博主「lt要努力」

原文链接：https://blog.csdn.net/louting249/article/details/104615411

CSDN博主「孟孟~」

原文链接：https://blog.csdn.net/qq_37471721/article/details/98863099

<el-checkbox-group
	v-else-if="item.type === 'checkbox'"
	v-model="data[item.key]"
>
	<el-checkbox
		v-for="(item1, index1) in item.option"
		:key="index1"
		:label="item1[item.optionValue || 'value'] + ''"
		>{{
			item1[item.optionLabel || "label"]
		}}</el-checkbox
	>
</el-checkbox-group>

问题1：Cannot read property 'length' of undefined

data[item.key] 必须声明为数组，不能是undefined；

问题2：无法选中

:label="item1[item.optionValue || 'value'] + ''" 是选中后的键，且需为字符串，

item1[item.optionLabel || "label"] 是显示的值

晓_枫

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
Element-ui 多选框使用问题

参考文章：CSDN博主「lt要努力」原文链接：https://blog.csdn.net/louting249/article/details/104615411CSDN博主「孟孟~」原文链接：https://blog.csdn.net/qq_37471721/article/details/98863099<el-checkbox-group v-else-if="item.type === 'checkbox'" v-model="data[item.key]"&g
复制链接

扫一扫