vue中改变选中当前项的显示隐藏或者状态的实现方法


Posted in Javascript onFebruary 08, 2018

在vue中已经不像jq那样直接操作dom了,如果要指向当前选中项时,就不能再用jq的思路来做了,方法如下:

vue中改变选中当前项的显示隐藏或者状态的实现方法

当指向一个状态的时候,只让指向的状态隐藏,其他项不变,如果项目中用了element-ui,那么操作起来会比较简单一些,这样设置:

v-if="(row.id == currentId&&row.auditState==0)?checkState:!checkState" @mouseover="statehidden(row.id)"

js中:

statehidden(id){
   this.currentId=id; 
  },

这种方法的思路是:鼠标指向某一项时,获取到某一项的id存在一个变量中,判断row.id==currentId,控制这个按钮显示隐藏就可以了,因为只有在鼠标指向某一项的时候才能拿到当前项的id,所以可以利用row.id==currentId来判断,这样就能轻松实现控制当前项的变化

以上这篇vue中改变选中当前项的显示隐藏或者状态的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript高级程序设计 阅读笔记(十四) js继承机制的实现
Aug 14 Javascript
js动态添加onclick事件可传参数与不传参数
Jul 29 Javascript
jQuery中 delegate使用的问题
Jul 03 Javascript
jQuery Validate初步体验(一)
Dec 12 Javascript
基于KO+BootStrap+MVC实现的分页控件代码分享
Nov 07 Javascript
js 动态生成json对象、时时更新json对象的方法
Dec 02 Javascript
浅谈JavaScript中的属性:如何遍历属性
Sep 14 Javascript
解决Vue打包之后文件路径出错的问题
Mar 06 Javascript
vue自定义filters过滤器
Apr 26 Javascript
微信小程序云开发实现云数据库读写权限
May 17 Javascript
vue读取本地的excel文件并显示在网页上方法示例
May 29 Javascript
精读《Vue3.0 Function API》
May 20 Javascript
Ionic学习日记实现验证码倒计时
Feb 08 #Javascript
vue父组件点击触发子组件事件的实例讲解
Feb 08 #Javascript
vue中实现在外部调用methods的方法(推荐)
Feb 08 #Javascript
10 种最常见的 Javascript 错误(频率最高)
Feb 08 #Javascript
Vue组件通信的四种方式汇总
Feb 08 #Javascript
Vue Socket.io源码解读
Feb 07 #Javascript
原生JavaScript实现的简单放大镜效果示例
Feb 07 #Javascript
You might like
PHP MVC模式在网站架构中的实现分析
2010/03/04 PHP
php 解压rar文件及zip文件的方法
2014/05/05 PHP
ThinkPHP公共配置文件与各自项目中配置文件组合的方法
2014/11/24 PHP
Java中final关键字详解
2015/08/10 PHP
thinkphp框架下404页面设置 仅三步
2016/05/14 PHP
Yii核心验证器api详解
2016/11/23 PHP
PHP实现对xml进行简单的增删改查(CRUD)操作示例
2017/05/19 PHP
PHP实现发送微博消息功能完整示例
2019/12/04 PHP
Aster vs Newbee BO3 第二场2.18
2021/03/10 DOTA
JAVASCRIPT keycode总结
2009/02/04 Javascript
JavaScript eval() 函数介绍及应用示例
2014/07/29 Javascript
jQuery实现简单的列表式导航菜单效果代码
2015/08/31 Javascript
Jquery中map函数的用法
2016/06/03 Javascript
js数组与字符串常用方法总结
2017/01/13 Javascript
JS实现二维数组元素的排列组合运算简单示例
2019/01/28 Javascript
微信小程序纯文本实现@功能
2020/04/08 Javascript
[44:01]2018DOTA2亚洲邀请赛3月30日 小组赛B组 EG VS paiN
2018/03/31 DOTA
python 图片验证码代码分享
2012/07/04 Python
python分析nignx访问日志脚本分享
2015/02/26 Python
Python字符编码与函数的基本使用方法
2017/09/30 Python
python按时间排序目录下的文件实现方法
2018/10/17 Python
python3实现表白神器
2019/04/09 Python
如何基于python3和Vue实现AES数据加密
2020/03/27 Python
Python模拟伯努利试验和二项分布代码实例
2020/05/27 Python
基于Python模拟浏览器发送http请求
2020/11/06 Python
canvas生成带二维码海报的踩坑记录
2019/09/11 HTML / CSS
写好自荐信的技巧
2013/11/08 职场文书
护士在校生自荐信
2014/02/01 职场文书
学生个人自我鉴定
2014/03/26 职场文书
森马旗舰店双十一营销方案
2014/09/29 职场文书
求职自我推荐信
2015/03/24 职场文书
2015年度团总支工作总结
2015/04/23 职场文书
2016优秀员工先进事迹材料
2016/02/25 职场文书
MySQL数字类型自增的坑
2021/05/07 MySQL
详解分布式系统中如何用python实现Paxos
2021/05/18 Python
我的收音机情缘
2022/04/05 无线电