编程 Javascript

解决v-for中使用v-if或者v-bind:class失效的问题

Posted in Javascript onSeptember 25, 2018

在v-for循环出来的列表中使用v-bing动态绑定class、v-show或v-if动态控制个别item 场景一般多用于多项选择

原因是在v-for循环的时候 items是动态创建，所以不会被监听并且实时动态控制class

解决方法是 vm.$set 官方文档中有介绍

我的解决方法使用了框架自带多选按钮，将样式呈现出来

解决v-for中使用v-if或者v-bind:class失效的问题

但仅仅是样式呈现，在循环items的时候，给它新增属性isSelect

解决v-for中使用v-if或者v-bind:class失效的问题

然后在点击选择的时候，动态设置isSelect属性

解决v-for中使用v-if或者v-bind:class失效的问题

在提交的时候去循环判断该list每一项的isSelect属性，从而达到同样的效果

以上这篇解决v-for中使用v-if或者v-bind:class失效的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持三水点靠木。

解决v-for中使用v-if或者v-bind:class失效的问题

- Author -

爱情与灵药cium

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

解决遍历时Array.indexOf产生的性能问题

Jul 03 Javascript

node.js中的http.createClient方法使用说明

Dec 15 Javascript

JS输入用户名自动显示邮箱后缀列表的方法

Jan 27 Javascript

js进行表单验证实例分析

Feb 10 Javascript

jquery插件jquery.beforeafter.js实现左右拖拽分隔条对比图片的方法

Aug 07 Javascript

JS无缝滚动效果实现方法分析

Dec 21 Javascript

基于JavaScript实现的希尔排序算法分析

Apr 14 Javascript

微信小程序标签传入数据

May 08 Javascript

Node.js 中使用 async 函数的方法

Nov 20 Javascript

基于vue实现圆形菜单栏组件

Jul 05 Javascript

Javascript如何实现双指控制图片功能

Feb 25 Javascript

Vue通过Blob对象实现导出Excel功能示例代码

Jul 31 Javascript

在axios中使用params传参的时候传入数组的方法

Sep 25 #Javascript

VUE实现可随意拖动的弹窗组件

Sep 25 #Javascript

vue移动端弹框组件的实例

Sep 25 #Javascript

JavaScript常用数组操作方法,包含ES6方法

May 10 #Javascript

在vue项目中,将juery设置为全局变量的方法

Sep 25 #Javascript

解决vue A对象赋值给B对象,修改B属性会影响到A的问题

Sep 25 #Javascript

解决vue-cli webpack打包后加载资源的路径问题

Sep 25 #Javascript

You might like

PHP4(windows版本)中的COM函数

2006/10/09 PHP

php.ini中的php-5.2.0配置指令详解

2008/03/27 PHP

PHPMailer邮件发送的实现代码

2013/05/04 PHP

php中隐形字符65279（utf-8的BOM头）问题

2014/08/16 PHP

PHP验证信用卡卡号是否正确函数

2015/05/27 PHP

PHP+Ajax实现无刷新分页实例详解(附demo源码下载)

2016/04/07 PHP

yii2.0框架场景的简单使用示例

2020/01/25 PHP

javascript 密码强度验证规则、打分、验证（给出前端代码，后端代码可根据强度规则翻译）

2010/05/18 Javascript

JavaScript 类型的包装对象(Typed Wrappers)

2011/10/27 Javascript

基于OO的动画附加插件,可以实现弹跳、渐隐等动画效果分享

2013/06/24 Javascript

在Ubuntu系统上安装Ghost博客平台的教程

2015/06/17 Javascript

JavaScript学习笔记之检测客户端类型是（引擎、浏览器、平台、操作系统、移动设备）

2015/12/03 Javascript

jQuery特殊符号转义的实现

2016/11/30 Javascript

Javascript 两种刷新方法以及区别和适用范围

2017/01/17 Javascript

JS实现颜色的10进制转化成rgba格式的方法

2017/09/04 Javascript

jQueryUI Sortable 应用Demo(分享)

2017/09/07 jQuery

vue中动态设置meta标签和title标签的方法

2018/07/11 Javascript

深入理解JavaScript的值传递和引用传递

2018/10/24 Javascript

JavaScript如何实现监听键盘输入和鼠标监点击

2020/07/20 Javascript

解决vue 退出动画无效的问题

2020/08/09 Javascript

python装饰器decorator介绍

2014/11/21 Python

总结Python中逻辑运算符的使用

2015/05/13 Python

python处理按钮消息的实例详解

2017/07/11 Python

对numpy和pandas中数组的合并和拆分详解

2018/04/11 Python

Python过滤txt文件内重复内容的方法

2018/10/21 Python

python中正则表达式与模式匹配

2019/05/07 Python

python hash每次调用结果不同的原因

2019/11/21 Python

如何基于Python爬取隐秘的角落评论

2020/07/02 Python

CSS3感应鼠标的背景闪烁和图片缩放动画效果

2014/05/14 HTML / CSS

Spanx塑身衣官网：美国知名内衣品牌

2017/01/11 全球购物

英国演唱会订票网站：Ticket Selection

2018/03/27 全球购物

Nixon手表英国官网：美国尼克松手表品牌

2020/02/10 全球购物

《为人民服务》教学反思

2016/02/20 职场文书

优秀的商业计划书，让融资一步到位

2019/05/07 职场文书

2019最新激励员工口号大全！

2019/06/28 职场文书

2019年励志签名：致拼搏路上的自己

2019/10/11 职场文书