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

最新推荐文章于 2024-06-22 17:06:26 发布
最新推荐文章于 2024-06-22 17:06:26 发布
阅读量2.1k 收藏 1
点赞数 2
分类专栏： iview vue 文章标签： vue iview
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/panlin1506913260/article/details/107856704
版权
iview 同时被 2 个专栏收录
5 篇文章 0 订阅
订阅专栏
vue
5 篇文章 0 订阅
订阅专栏

最近开发遇见一个需求就是当 某参数param 等于 几的时候 才出发@click事件

<div class="treeLi" v-if='item.classifyLevel === '4'' @click="chooseDev(item.id,item.classifyName)">
  <div class="treeLi_txt">{{item.classifyName}} </div>
</div>

以上写法 不符合需求，需求是当 classifyLevel == 4 才触发click事件，需求是满足了 但是 当 classifyLevel 不等于4的时候 classifyName不显示，这明显不对于是 

<div class="treeLi" @click="item.classifyLevel === '4' && chooseDev(item.id,item.classifyName)">
  <div class="treeLi_txt">{{item.classifyName}} </div>
</div>

修改成这样就符合需求

夭荆
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue根据条件添加 click 事件
weixin_42956406的博客
03-30 993
方式一：在绑定事件中直接添加标示量clickFlag <div @click="clickFlag && addGoodsHandler()"> XXX... </div> 方式二：用v-if 、v-else-if、v-else 判断 <div v-if="clickFlag" @click="addGoodsHandler()"> XXX... </div> <div v-else> XXX... .
vue2.0-vue-cli搭建项目学习 onclick事件绑定 v-if v-show v-for 的用法
weixin_40888956的博客
04-25 9905
vue-cli搭建项目参考地址https://cn.vuejs.org/v2/guide/installation.html先安装node.js  在安装vue.js.安装完成 安装全局vue-cli npm install --global vue-cli    下一步搭建项目 vue init webpack vue-projeck。下一步安装运行依赖 npm install。&lt;temp...
vue如何根据条件加click事件
wei_dan1129的博客
08-17 3578
方式一：在绑定事件中直接添加标示量clickFlag（条件） <div class="situation-item" @click="clickFlag && add()"> 添加</div> 方式二：用v-if 、v-else-if、v-else 判断 <div v-if="clickFlag" @click="add()"> 添加 </div> <div v-else> 添加 </div> ...
Vue-条件渲染,事件绑定指令
最新发布
Kevin7_35Durant的博客
06-22 293
只有v-show这个指令在里面。
Vue v-if、v-else、@click使用实例
weixin_44167504的博客
10-26 1114
Vue v-if、v-else、@click使用实例 根据loginType的值不同而切换显示的内容，动图显示： html： <div id="app"> <template v-if="loginType === 'username'"> <label>Username</label> <input placeholder="Enter your username" key="username-input">
vue根据条件添加click事件
07-14
在Vue中，你可以使用`v-if`或`v-show`指令来根据条件动态添加或移除元素，并在其中的元素上添加`@click`事件。 以下是一个示例： ```html <button v-if="showButton" @click="handleClick">点击按钮 ...
解决vue的touchStart事件及click事件冲突问题
11-20
console.log('click事件执行一次') this.$emit('change', e.target.innerText) }, handleTouchStart (e) { console.log('TouchStart执行一次') this.touchStatus = true }, handleSelfClick (e) { console....
click事件形成的条件 - Eric
weixin_33859844的博客
01-11 795
鼠标点击后触发click事件的必要条件 - Eric 场景 1、页面上有很多输入框（发货单号），鼠标离开文本框会向后台发送请求保存发货单号，请求时页面会出现loading遮罩。2、页面上有一个【发货】按钮，点击发货按钮会向后台获取需要发货的数据（包含发货单号） 问题 在输入框中填写完发货单号，直接点击发货按钮时，有时候无法触发发货事件(...
几种触发点击事件的方法
wkf4808的博客
08-03 1232
//法1： $('#btn1').on('click',function(){ alert(1); }) //法2： $('#btn1').bind('click',function(){ alert(1); }) //法3： $('#btn1').trigger('click'); //法4： if(document.attachEvent)        { do
vue中的事件加判断条件进行选择性点击
document_write的博客
08-23 6936
@click="(items.length>1)?choose(items):''"
执行click事件
chinaxiaofeng8的专栏
08-29 1121
1、比如，我们要弹出一个网页：http://www.cuplayer.com，那么可以 构造： 　　&lt;a id="openWin" href="http://www.cuplayer.com"&gt;&lt;/a&gt; 　　然后写脚本，   JS写法： document.getElementById('openWin').click(); ...
Vue根据条件添加click事件
热门推荐
weixin_34138139的博客
12-02 1万+
需求：根据特定条件，增加或者去掉click事件（例如：clickFlag == true时，添加click事件；clickFlag == false时，去掉click事件；） 解决方法： 方式一：在绑定事件中直接添加标示量clickFlag <div @click="clickFlag && addGoodsHandler()"> 添加产品 </div...
vue3 事件处理 @click
一步一个脚印，踏实努力，向着目标前进
08-17 1万+
在Vue 3中，事件处理可以通过@click指令来实现。@click指令用于监听元素的点击事件，并在触发时执行相应的处理函数。下面是一个简单的示例，展示了如何在Vue 3中处理点击事件：
vue点击事件 根据条件判断是否可以点击
kk
03-05 9491
需求：根据特定条件，增加或者去掉click事件（例如：clickFlag == true时，添加click事件；clickFlag == false时，去掉click事件；） 解决方法： 方式一：在绑定事件中直接添加标示量clickFlag <div @click="clickFlag && addGoodsHandler()"> 为真 </div> <div v-else> 为假 </div> 方...
vue：事件动态绑定不同的响应
not_a_id的博客
05-07 223
实现： data(){ return{ response:['fun1', 'fun2'] } } method:{ fun1(){ console.log('this is fun1') } fun2(){ console.log('this is fun2') } indirectCall(method){ this[method]() } /* indirectCall(event, method){ // do someth
Vue基础语法之@click、时间修饰符@click.stop与@click.prevent、按键修饰符（如@keyup.enter）
我是一只蘑菇17的博客
11-26 3524
1、绑定监听@click:（以监听click为例，其他如keyup，用法类似）   v-on:click="fun"   @click="fun"   @click="fun(参数)" <button @click="test1">test1</button>  <button @click="test2('abc')">test2&...
vue @click的常用方法
蠢蠢欲动的猫
12-10 1万+
点击事件的常用方法 **v-on click 简写是@click** **点击事件的常见的几种使用方法(在vue中)：** ​ 1.prevent：阻止默认事件（常用）； ​ 2.stop：阻止事件冒泡（常用）； ​ 3.once：事件只触发一次（常用）； ​ 4.capture：使用事件的捕获模式； ​ 5.self：只有event.target是当前操作的元素时才触发事件； ​
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值