首页 > 代码库 > vue 全选与取消全选
vue 全选与取消全选
所用知识点
1 v-model:监听input内容
2 watch:监听属性方法
参考https://cn.vuejs.org/v2/api/#watch
3 页面初始化调用函数 mounted
一:html元素
实现思路
1 v-model 一个收集所有input(除全选框外)数组checkModel ,vue会动态将其checked为true的input的value值存入数组checkModel里
2 watch函数来监听checkModel 属性,当其长度==input元素时 全选按钮选中 否则取消
3 全选按钮v-model checkAll 属性来显示当前选中状态 click事件里 当checkAll为true时 全选 所有input按钮被选中也就是checkModel的遍历存入其value值
完整代码:
备注:这里getUserData()函数并没有使用到只是为有序ajax请求渲染页面做铺垫
vue 全选与取消全选
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。