vue中的事件加判断条件如何进行选择性点击
vue中事件加判断条件进行选择性点击
@click="(items.length>1)?choose(items):''"
vue点击事件 根据条件判断是否可以点击
需求
根据特定条件,增加或者去掉click事件
(例如:clickFlag == true时,添加click事件;clickFlag == false时,去掉click事件;)
解决方法
方式一:在绑定事件中直接添加标示量clickFlag
<div @click="clickFlag && addGoodsHandler()"> 为真 </div> <div v-else> 为假 </div>
方式二:用v-if 、v-else-if、v-else 判断
<div v-if="clickFlag" @click="addGoodsHandler()"> 为真 </div> <div v-else> 为假 </div>
很明显,第一种感觉更高级,用更少的代码完成功能,Write less,Do more
总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。
相关文章
Vue实现获取后端接口API代码片段(已封装Service方法名)
Vue实现获取后端接口API代码片段(已封装Service方法名),具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教2022-07-07基于Vue sessionStorage实现保留搜索框搜索内容
这篇文章主要介绍了基于Vue sessionStorage实现保留搜索框搜索内容,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-06-06Vue路由回退的完美解决方案(vue-route-manager)
最近做了一个vue项目关于路由场景的问题,路由如何回退指定页面,在此做个记录,这篇文章主要给大家介绍了关于Vue路由回退的完美解决方案,主要利用的是vue-route-manager,需要的朋友可以参考下2021-09-09关于vue中@click.native.prevent的说明
这篇文章主要介绍了关于vue中@click.native.prevent的说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教2022-03-03前端插件库之vue3使用vue-codemirror插件的步骤和实例
CodeMirror是一款基于JavaScript、面向语言的前端代码编辑器,下面这篇文章主要给大家介绍了关于前端插件库之vue3使用vue-codemirror插件的步骤和实例,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-07-07
最新评论