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

相关推荐
英勇无比的消炎药19 分钟前
一站式汇总TinyVue工具案例与真实落地经验
vue.js·前端框架
xiaofeichaichai23 分钟前
前端安全 XSS 与 CSRF
前端·安全·xss
JS菌32 分钟前
Skills 动态加载系统:让 AI Agent 按需获取领域知识
前端·人工智能·后端
weedsfly34 分钟前
Sass 代码复用完全指南:从变量到模块化
前端
张拭心39 分钟前
Android 17 新特性:后台音频交互限制加强
android·前端
张拭心1 小时前
Android 17 新特性:ProfilingManager 新触发器
android·前端
黄敬峰1 小时前
从 XMLHttpRequest 到 JSON 模拟:打通前后端通信的任督二脉
javascript
weixin_471383031 小时前
Taro-03-页面生命周期
前端·javascript·taro
张拭心1 小时前
Android 17 新特性:MessageQueue 无锁实现
android·前端