Vue根据条件添加click事件的方式


Posted in Javascript onNovember 09, 2019

需求:根据特定条件,增加或者去掉click事件(例如:clickFlag == true时,添加click事件;clickFlag == false时,去掉click事件;)

解决方法:

方式一:在绑定事件中直接添加标示量clickFlag

<div @click="clickFlag && addGoodsHandler()">
 添加产品
</div>

方式二:用v-if 、v-else-if、v-else 判断

<div v-if="clickFlag" @click="addGoodsHandler()">
 添加产品
</div>
<div v-else>
 添加产品
</div>

以上这篇Vue根据条件添加click事件的方式就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript入门教程(3) js面向对象
Jan 31 Javascript
jQuery Deferred和Promise创建响应式应用程序详细介绍
Mar 05 Javascript
textarea不能通过maxlength属性来限制字数的解决方法
Sep 01 Javascript
JavaScript数据类型详解
Apr 01 Javascript
JS动画效果打开、关闭层的实现方法
May 09 Javascript
详解JavaScript中的客户端消息框架设计原理
Jun 24 Javascript
JS拖拽插件实现步骤
Aug 03 Javascript
Angular 应用技巧总结
Sep 14 Javascript
JS实现禁止鼠标右键的功能
Oct 15 Javascript
一道面试题引发的对javascript类型转换的思考
Mar 06 Javascript
纯js实现图片匀速淡入淡出效果
Aug 22 Javascript
浅谈高大上的微信小程序中渲染html内容—技术分享
Oct 25 Javascript
浅谈vuex中store的命名空间
Nov 08 #Javascript
解决$store.getters调用不执行的问题
Nov 08 #Javascript
在Vue中使用this.$store或者是$route一直报错的解决
Nov 08 #Javascript
vue.js的状态管理vuex中store的使用详解
Nov 08 #Javascript
vue.js 子组件无法获取父组件store值的解决方式
Nov 08 #Javascript
VUEX采坑之路之获取不到$store的解决方法
Nov 08 #Javascript
vue路由拦截器和请求拦截器知识点总结
Nov 08 #Javascript
You might like
Yii2主题(Theme)用法详解
2016/07/23 PHP
Laravel中Facade的加载过程与原理详解
2017/09/22 PHP
Laravel中批量赋值Mass-Assignment的真正含义详解
2017/09/29 PHP
用JavaScript脚本实现Web页面信息交互
2006/10/11 Javascript
从新浪弄下来的全屏广告代码 与使用说明
2007/03/15 Javascript
JavaScript 全角转半角部分
2009/10/28 Javascript
JS完成代码前最好对其做5件事
2013/04/07 Javascript
JS特殊函数(Function()构造函数、函数直接量)区别介绍
2013/05/19 Javascript
JavaScript中跨域调用Flash的方法
2014/08/11 Javascript
require.js深入了解 require.js特性介绍
2014/09/04 Javascript
JS获取各种宽度、高度的简单介绍
2014/12/19 Javascript
jquery使用remove()方法删除指定class子元素
2015/03/26 Javascript
JQuery自适应窗口大小导航菜单附源码下载
2015/09/01 Javascript
JavaScript数组去重的6个方法
2017/01/21 Javascript
完美解决浏览器跨域的几种方法(汇总)
2017/05/08 Javascript
[原创]js实现保存文本框内容为本地文件兼容IE,chrome,火狐浏览器
2018/02/14 Javascript
iview在vue-cli3如何按需加载的方法
2018/10/31 Javascript
Vue项目引发的「过滤器」使用教程
2019/03/12 Javascript
[07:27]DOTA2卡尔工作室 英雄介绍水晶室女篇
2013/06/21 DOTA
Python HTMLParser模块解析html获取url实例
2015/04/08 Python
基于wxpython开发的简单gui计算器实例
2015/05/30 Python
神经网络python源码分享
2017/12/15 Python
python爬虫-模拟微博登录功能
2019/09/12 Python
关于ZeroMQ 三种模式python3实现方式
2019/12/23 Python
使用tensorflow进行音乐类型的分类
2020/08/14 Python
pycharm专业版远程登录服务器的详细教程
2020/09/15 Python
python statsmodel的使用
2020/12/21 Python
电气工程和自动化自荐信范文
2013/12/25 职场文书
社区工作者思想汇报
2014/01/13 职场文书
年终奖发放方案
2014/06/02 职场文书
社区党员志愿服务活动方案
2014/08/18 职场文书
力克胡哲观后感
2015/06/10 职场文书
会计工作自我鉴定范文
2019/06/21 职场文书
Pytorch 中net.train 和 net.eval的使用说明
2021/05/22 Python
Vue监视数据的原理详解
2022/02/24 Vue.js
关于ObjectUtils.isEmpty() 和 null 的区别
2022/02/28 Java/Android