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值。

相关推荐
廖菌1 分钟前
DATASPACE3D 产品介绍:面向数字孪生与 Web3D 场景的一体化可视化搭建平台
前端·webgl
敖行客 Allthinker2 分钟前
前端调试实战:DevTools调试工具 + 二分定位Bug法全总结
前端·typescript·chrome devtools
暗不需求3 分钟前
手写深拷贝:从 JSON 到递归,彻底解决循环引用问题
前端·面试
灏仟亿前端技术团队7 分钟前
DOMagic:把 AI 修改绑定到页面节点的前端开发态插件
前端
Lugas7 分钟前
浏览器为什么要如此严格地限制跨域请求?
前端·黑客·浏览器
想要成为糕糕手9 分钟前
前端异步编程的终极指南:从 Promise 到 async/await,这一次彻底搞懂!
javascript·promise
Cobyte14 分钟前
17.响应式系统比对:链表如何实现响应式系统的高效更新
前端·javascript·vue.js
2601_9637713718 分钟前
Speeding Up Creative Agency Portfolios: A Performance Guide
前端·数据库·php
禅思院19 分钟前
AI对话前端从入门到崩溃:一个长对话引发的五层优化战争【二】
前端·前端框架·ai编程
虚心的百褶裙42 分钟前
JavaScript性能优化
开发语言·javascript·性能优化