el-checkbox修改选中和未选中的值

最新推荐文章于 2024-05-21 21:57:08 发布
最新推荐文章于 2024-05-21 21:57:08 发布
阅读量2.8k 收藏 1
点赞数
文章标签： 前端 javascript vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45054614/article/details/132168603
版权

由于在checkbox选中的时候，默认的是为true和false。
后端定义的绑定字段不是为布尔值，而是为0，1

解决办法

<el-checkbox 
	v-model="model.status" 
	:true-label="1" 
	:false-label="0">
</el-checkbox>

<!--true-label 代表选中  
	 true-label="1"这个表示的绑定字符串的1
	:true-label="1"这个表示绑定的为数字的1
	-->
<!--false-label 未选中
	 true-label="0"这个表示的绑定字符串的0
	:true-label="0"这个表示绑定的为数字的0
-->
小hu同学
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
分别获取checkbox选中和没选中的值
SJK__的博客
03-21 9633
方法一： 定义两个列表分别存储选中和没选中的值 each是遍历的意思 var check_list = [] var nocheck_list = [] # 将获取到选中的value 遍历添加到列表里 $("input[name='checkbox']:checked").each(function(){ check_list.push($(this).val(...
获取checkbox选中的值和设置checkbox选中
黄色气球
03-28 5462
获取checkbox选中的值&lt;input name="RefAnswer" type="checkbox" value="B" /&gt;var arr = new Array();$('input[name="RefAnswer"]:checked').each(function (i) {    arr[i] = $(this).val(); });var vals = arr.join...
el-check的change事件拿到勾选状态
weixin_52268321的博客
04-28 498
change事件如何拿到当前勾选状态？多选框被勾选时，触发change事件。
checkbox 选中和不选中的值分别设置
weixin_46362547的博客
07-07 1万+
轻松解决选中和未选中checkbox的value一样的问题 <input type="checkbox" value="uncheck" name="check" onclick="this.value=(this.value=='uncheck')?'checked':'uncheck'">
【Vue】el-checkbox多选框实现单选效果，选中一个选项则自动取消其他勾选
最新发布
coderYYY的博客
05-21 900
多选框的样式，单选框的效果
让checkbox不选中即将选中的checkbox不选中
12-09
今天在做项目的时候，遇到一个问题。需要把选中的checkbox置空，即将选中的checkbox不选中。最后，发现一个方法很好使，特此记录。 $("input[type='checkbox']").each(function(){ if(this.checked){ this.checked=false; } }); 原理：循环每一个type为checkbox的input，若其是选中状态，就将他的checked属性置为false就ok了。 当然，若要实现反选的效果，再加一点就好了。代码如下： $("input[type='checkbox']").each(function(){ if(th
关于emelentui使用el-checkbox使用数字回显问题
偶尔写些东西，意思一下我也参与了内卷
10-27 2106
必须用引号
vue与element ui的el-checkbox的坑el-checkbox不能选中或者选中不能取消
热门推荐
jerryyang_2017的博客
06-17 2万+
一，场景 通过使用checkbox，实现如图的场景， 点击某个tag，实现选中和非选中状态。 二， 官网的例子 通过切换checked值为true或者false来实现，一个checkbox的状态切换 <template> <!-- `checked` 为 true 或 false --> <el-checkbox v-model="checked">备选项</el-checkbox> </template> <scr
Element UI el-checkbox 选中 取消 取值（详解）
Bnana博客
03-19 1万+
使用 element ui checkbox 多选框 checkbox 选中 checkbox 取消 checkbox @change 事件 </el-checkbox-group> checkbox 默认选中项 checkbox 取消选中 获取选中总数
checkbox 只有一个复选框 选中保存值为1 没有选中就是0
LYR 的博客
10-10 3545
<input type=“checkbox” value=“0” name=“a” οnclick=“this.value=(this.value==0)?1:0”>
nested_el-checkbox:element-ui的el-checkbox实现嵌套多选，单选
05-12
若原本为未选中状态，则改为选中状态，若该菜单下有二级子菜单，所有子菜单也改为选中状态。 实现已有的选择记录的复现。 实现过程 1.data数据 data() { return { menu: [] //所有的菜单数组， menusIds: [] //...
Vue动态生成el-checkbox点击无法赋值的解决方法
12-03
最近遇到一个问题，在一个页面需要动态渲染页面内的表单，其中包括 checkbox 表单类型，并且使用 Element 组件 UI 时，此时 v-model 绑定的数据也是动态生成的 例如： 定义的 data 的 form 里面是空对象，需要动态...
checkbox点击事件修改样式
01-08
奈何这个项目组居然没有checkbox的样式，看着这原生的样式丑到爆，不得以研究了一下checkbox。（radio也是同理，区别是最好通过条件控制只能单选。） 这里先附上样式灵感来源地址 如果有需要变更图标的，可以在上述...
vue .js绑定checkbox并获取、改变选中状态的实例
10-18
对于复选框选中值的处理，我们可以利用`v-bind:true-value`和`v-bind:false-value`指令自定义选中和未选中的值，使数据更符合业务需求。通过这种方式，我们可以简化代码，提高开发效率，同时保持数据的准确性和一致...
checkbox 选中一个另一个checkbox也会选中的实现代码
09-02
当需要实现“选中一个 `checkbox` 另一个也会被选中”的功能时，通常会涉及到事件监听和状态同步。这篇教程将详细介绍如何通过 JavaScript（特别是 jQuery 库）来实现这种联动效果。 首先，我们要明白 `checkbox` ...
el-checkbox 实现单选功能
qq_44981128的博客
12-21 1万+
一、两个多选框实现单选 data(){ return{ status:1 } } <el-checkbox-group v-model="status"> <el-checkbox false-label='null' :true-label="1" name="status">启用</el-checkbox> <el-checkbox false-label='null' :true-label="2" name="status"&
ElementUI之checkbox绑定数据和后端不一对的选中与不选中
hotlinhao的专栏
12-28 2837
先演示Html代码： <el-checkbox label="查看" :true-label=1 :false-label=0 v-model="item.init" @change="checked=>changeItem(checked,index,'init
checkbox 通过onclick事件替换选中的“on”值，设置选中值为1，取消选中，设置其值为0 的简单方法
huanle_yhl的博客
10-13 6203
在input属性中添加onclick事件：onclick="this.value=this.checked?1:0" 举例： type="checkbox" name="hasPopupMsg1" #if($!hasPopupMsg1 == 1)checked="checked" #end onclick="this.value=this.checked?1:0"> 测试结果：
vue el-checkbox无法选中和取消
05-11
有几种情况可能导致 `el-checkbox` 无法选中和取消： 1. 绑定的 `v-model` 值没有正确的设置为 `true` 或 `false`。请确保你的 `v-model` 值的类型为布尔型，并且在选中时设置为 `true`，取消选中时设置为 `false`...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值