首页 > 其他分享 >vue .js获取checkbox是否选中

vue .js获取checkbox是否选中

时间:2023-06-05 10:00:46浏览次数:38  
标签:function jsvar vue items js item state checkbox


1.html

<div class="weui-cells weui-cells_checkbox font14" v-for="item in items">
<label class="weui-cell weui-check__label">
<div class="weui-cell__ft width-inherit">
<input type="checkbox" class="weui-check" v-on:click="CheckItem(item)" v-model="item.state" name="checkbox" />
</div>
</label>
</div>

 

2.js

var vum = new Vue({
data:{
items:[]
}
methods:{
CheckItem:function(item){
item.state = !item.state;
console.log(this.items);
}
}
})

标签:function,jsvar,vue,items,js,item,state,checkbox
From: https://blog.51cto.com/chengzheng183/6413337

相关文章

  • vue消息订阅与发布
    1.点一下加号: 2.安装第三方库:(pubsub-js,实现消息发布订阅也可以用其他库)  3.从收数据的人引入库“【引入之后的pubsub是一个对象,对象身上有很多有用的方法】 4.收数据的人订阅消息:【subscribe后面两个形参,第一个为消息名,第二个才是消息内容】还需要注意订阅消息的人最......
  • 序列化模块JSON
    序列化模块什么叫序列化——将原本的字典、列表等内容转换成一个字符串的过程就叫做序列化。【一】为什么要有序列化模块比如,我们在python代码中计算的一个数据需要给另外一段程序使用,那我们怎么给?现在我们能想到的方法就是存在文件里然后另一个python程序再从文件里......
  • nodejs express的部署简单记录(不详细)
    1.选用Linux系统2.node测试的包有expressknex3.Linux安装nodejs环境https://github.com/nodesource/distributions4.Linux系统权限(sudo)npm安装pm25.用pm2启动后端服务示例:pm2startindex.mjs6.注意端口号占用7.防火墙打开对应端口号 importexpressfr......
  • JS中创建对象的几种常见的方式
    创建对象方式//方式1varobj1={"name":"方式1"}//方式2varobj2={name:"方式2"}//方式3varobj3=newObject({"name":"方式3"});//方式4varobj4=newObject();obj4.name="方式4"//方式5:通过对象构造器创建对象fu......
  • vue前端model和data强关联
    如果不关联会报错,且错误不好找!......
  • JS中的异步编程
    目录前言什么是Promise?为什么用fetch?async、await基本使用方法ajax请求自定义请求HTML请求JSON请求ResponsemetadataPostformPostJSONFileupload注意点前言fetch是用来替代传统的XMLHttpRequest的。fetch的优点很多,包括链式调用的语法、返回promise等。什么是Promi......
  • vue3 条件判断语句及v-if与v-show 区别
    <template> <divv-if="type==='a'">aaa</div> <divv-else-if="type==='b'">bbb</div> <divv-else>ccc</div>  <divv-show="flag">111</div> </template>......
  • vue3元素标签属性的绑定
    <template> <divv-bind:id="main"v-bind:class="message">aaa</div></template><script> exportdefault{   data(){      return{         message:'active',         main:'mainid' ......
  • Vue基础
    目录一属性指令1.1属性指令使用1.2换图片小案例二style和class2.1数据的绑定2.2class的使用2.3style的使用三条件渲染四列表渲染4.1v-for显示购物车4.2v-for循环其它类型4.3key值的解释4.4数组更新与检测可以检测到变动的数组操作检测不到变动的数组操作五事件......
  • Vue3 模板语法学习
    <template> {{message}} {{number+1}} {{ok?'yes':'no'}}</template><script> exportdefault{   data(){      return{         message:'aaa',         number:10,         ok:false      }   } }&l......