el-checkbox 无法动态设置勾选状态

问题

cheked 值动态变化,但是勾选状态无法动态改变

解决

v-model 与:checked 同时使用

html 复制代码
 <el-checkbox 
 class="add-shop-check" 
 v-model="renderData[0].isCheck" 
 :checked="renderData[0].isCheck" 
 @change="checked => selectChange(checked, 0)"
 ></el-checkbox>

v-modle:双向绑定:

通过修改checked的值可以控制复选框的选中状态,通过点击复选框选中或者取消选中复选框可以修改checked的值。
checked:初始选中状态:

设置复选框初始是否被选中,后期不能通过修改checked值改变复选框选中状态,也不能通过点击复选框修改checked的值。
value:单项绑定:

只能通过修改checked值改变其选中状态,不能通过点击复选框改变checked值,不能通过点击改变其选中状态,其选中状态依赖value,若想实现点击改变其选中状态可以添加change事件,通过change事件修改value值。

相关推荐
givemeacar6 小时前
十七:Spring Boot依赖 (2)-- spring-boot-starter-web 依赖详解
前端·spring boot·后端
前端郭德纲6 小时前
JavaScript原生开发与鸿蒙原生开发对比
开发语言·javascript·harmonyos
辻戋6 小时前
从零开始手写mini-webpack
前端·webpack·node.js
cch89186 小时前
PHP vs 易语言:Web开发与桌面编程大对决
开发语言·前端·php
百撕可乐6 小时前
NextJS官网实战02:项目的基础骨架搭建
前端·javascript·react.js
陈天伟教授6 小时前
人工智能应用- 人工智能风险与伦理:01.数据安全
前端·人工智能·安全·xss·csrf
用户69371750013846 小时前
Android 17 完整更新详解:Beta 3 已达平台稳定,这些新功能值得期待
android·前端·android studio
fengci.6 小时前
Polar春季个人挑战赛WEB简单部分
android·前端
竹林8186 小时前
Web3前端开发:使用ethers.js监听智能合约事件
javascript·智能合约
张元清6 小时前
不用 WebSocket 库,在 React 中构建实时功能
前端·javascript·面试