vue中的事件加判斷條件如何進(jìn)行選擇性點(diǎn)擊
更新時(shí)間：2024年03月07日 08:50:05 作者：document_write
這篇文章主要介紹了vue中的事件加判斷條件如何進(jìn)行選擇性點(diǎn)擊方式,具有很好的參考價(jià)值,希望對大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
vue中事件加判斷條件進(jìn)行選擇性點(diǎn)擊
@click="(items.length>1)?choose(items):''"
vue點(diǎn)擊事件 根據(jù)條件判斷是否可以點(diǎn)擊
需求
根據(jù)特定條件，增加或者去掉click事件
（例如：clickFlag == true時(shí)，添加click事件；clickFlag == false時(shí)，去掉click事件；）
解決方法
方式一：在綁定事件中直接添加標(biāo)示量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
總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue3.0 CLI - 2.3 - 組件 home.vue 中學(xué)習(xí)指令和綁定
這篇文章主要介紹了vue3.0 CLI - 2.3 - 組件 home.vue 中學(xué)習(xí)指令和綁定的相關(guān)知識，本文通過實(shí)例代碼相結(jié)合的形式給大家介紹的非常詳細(xì) ,需要的朋友可以參考下2018-09-09
這篇文章主要介紹了vue樹形結(jié)構(gòu)獲取鍵值的方法示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-06-06
vue圓形進(jìn)度條環(huán)形進(jìn)度條組件內(nèi)部顯示圖片示例
這篇文章主要為大家介紹了vue圓形進(jìn)度條環(huán)形進(jìn)度條組件內(nèi)部顯示圖片示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-11-11
這篇文章主要給大家介紹了關(guān)于vue組件的路由高亮問題的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-05-05
Vue.js 2.0窺探之Virtual DOM到底是什么？
大家可能聽說Vue.js 2.0已經(jīng)發(fā)布，并且在其中新添加如了一些新功能。其中一個(gè)功能就是“Virtual DOM”。那么下面這篇文章就來給大家詳細(xì)介紹Vue.js 2.0中的Virtual DOM到底是什么？需要的朋友可以參考借鑒，下面來一起看看吧。2017-02-02
這篇文章主要介紹了vue 表單輸入框不支持focus及blur事件的解決方案，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-11-11
vue-router?導(dǎo)航完成后獲取數(shù)據(jù)的實(shí)現(xiàn)方法
這篇文章主要介紹了vue-router?導(dǎo)航完成后獲取數(shù)據(jù),通過使用生命周期的 created() 函數(shù)，在組件創(chuàng)建完成后調(diào)用該方法，本文結(jié)合實(shí)例代碼給大家講解的非常詳細(xì)需要的朋友可以參考下2022-11-11
這篇文章主要介紹了vue中的循環(huán)對象屬性和屬性值用法，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09
這篇文章主要介紹了vue3中的hooks總結(jié)，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-05-05
vue3+elementPlus項(xiàng)目支持生成、設(shè)置默認(rèn)附件方式
這篇文章主要介紹了vue3+elementPlus項(xiàng)目支持生成、設(shè)置默認(rèn)附件方式,具有很好的參考價(jià)值,希望對大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03