Vue根據(jù)條件添加click事件的方式
更新時(shí)間：2019年11月09日 08:50:18 作者：zhangxhl
今天小編就為大家分享一篇Vue根據(jù)條件添加click事件的方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
需求：根據(jù)特定條件，增加或者去掉click事件（例如：clickFlag == true時(shí)，添加click事件；clickFlag == false時(shí)，去掉click事件；）
解決方法：
方式一：在綁定事件中直接添加標(biāo)示量clickFlag
<div @click="clickFlag && addGoodsHandler()"> 添加產(chǎn)品 </div>
方式二：用v-if 、v-else-if、v-else 判斷
<div v-if="clickFlag" @click="addGoodsHandler()"> 添加產(chǎn)品 </div> <div v-else> 添加產(chǎn)品 </div>
以上這篇Vue根據(jù)條件添加click事件的方式就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue提供了mixins、extends配置項(xiàng)，最近使用中發(fā)現(xiàn)很好用。下面小編通過本文給大家介紹下vue中 mixins和extends的巧妙用法，需要的朋友參考下吧2017-12-12
Vue中監(jiān)視屬性和計(jì)算屬性區(qū)別解析
這篇文章主要介紹了Vue中監(jiān)視屬性和計(jì)算屬性區(qū)別,通過本文學(xué)習(xí)大家知道computed與watch配置項(xiàng)問題，computed能完成的功能，watch都可以完成，本文通過實(shí)例代碼給大家詳細(xì)講解，需要的朋友可以參考下2022-10-10
最近通過在網(wǎng)上查找資料，自己整合研究了一個(gè)可以直接在表格中操作數(shù)據(jù)的基于element-ui的前端模板?？梢宰屧龈臄?shù)據(jù)的操作顯得方便一點(diǎn)，感興趣的可以了解一下2021-12-12
Vue遞歸實(shí)現(xiàn)樹形菜單方法實(shí)例
學(xué)習(xí)vue有一段時(shí)間了，最近使用vue做了一套后臺(tái)管理系統(tǒng)，其中使用最多就是遞歸組件，下面這篇文章主要給大家介紹了關(guān)于Vue利用遞歸實(shí)現(xiàn)樹形菜單的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，需要的朋友可以參考下2018-11-11
vue-router中的hash和history兩種模式的區(qū)別
大家都知道vue-router有兩種模式，hash模式和history模式，這里來談?wù)剉ue-router中的hash和history兩種模式的區(qū)別。感興趣的朋友一起看看吧2018-07-07
vue使用require.context實(shí)現(xiàn)動(dòng)態(tài)注冊(cè)路由
這篇文章主要介紹了vue使用require.context實(shí)現(xiàn)動(dòng)態(tài)注冊(cè)路由的方法，幫助大家更好的理解和使用vue框架，感興趣的朋友可以了解下2020-12-12
vue2 element 彈出框拖拽會(huì)出現(xiàn)一層陰影問題解決方法
這篇文章主要介紹了vue2 element 彈出框拖拽會(huì)出現(xiàn)一層陰影問題解決方法,因增加 draggable 屬性導(dǎo)致我彈窗表單清空文本框時(shí),從右向左選中字體會(huì)出現(xiàn)拖拽陰影效果,本文給大家介紹vue2 element 彈出框拖拽會(huì)出現(xiàn)一層陰影問題解決方法,感興趣的朋友一起看看吧2024-01-01
Vue2項(xiàng)目中對(duì)百度地圖的封裝使用詳解
近期項(xiàng)目需求相關(guān)地圖限定使用百度地圖,功能比較簡單,下面這篇文章主要給大家介紹了關(guān)于Vue2項(xiàng)目中對(duì)百度地圖的封裝使用的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-06-06
關(guān)于iview按需引用后使用this.$Modal報(bào)錯(cuò)的解決
這篇文章主要介紹了關(guān)于iview按需引用后使用this.$Modal報(bào)錯(cuò)的解決，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-09-09
這篇文章主要給大家詳細(xì)介紹一下Vue3中的基本語法，文中的示例代碼講解詳細(xì)，對(duì)我們學(xué)習(xí)Vue3有一定的幫助，感興趣的小伙伴可以了解一下2022-11-11