第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何使用 Vue / JavaScript 在移動設(shè)備上觸發(fā)長按(點(diǎn)擊并按?。?/h1>

如何使用 Vue / JavaScript 在移動設(shè)備上觸發(fā)長按(點(diǎn)擊并按?。?/h1>
慕田峪7331174 2023-07-14 10:15:45
這僅適用于移動設(shè)備。它在桌面上按預(yù)期工作,因此我將省略所有這些樣式和功能。我有一個像這樣的 Vue 組件:模板<div class="container">  <div class="invisible-overlay-styles">    <button      v-if="! videoIsPlaying"      @click="playVideo()"      @mousedown="playVideo()"    >    </button>    <a      v-if="videoIsPlaying"    >    </a>  </div> <!-- invisible-overlay-styles -->  <video ... /> </div>所有的 div、按鈕、錨點(diǎn)和視頻都堆疊在一起,使用display: block和position: absolute; width: 100%; etc. etc. etc.方法  playVideo(){    console.log( 'Im playing!!' );    if( this.player ){      if( this.player.paused ){        this.player.play()      }    }  }如果我點(diǎn)擊它,它就會按預(yù)期工作:第一次單擊時,將播放視頻。第二次單擊時,將單擊該鏈接。但如果我單擊并按住,則 或@click都不會@mousedown被觸發(fā)。這都在:我的三星 Android 設(shè)備上的 Chrome在 iPhone 7 上的 Safari 瀏覽器上在我的 Mac 上的 iOS 模擬器中。...我已經(jīng)檢查過,當(dāng)我單擊并按?。ㄩL按)時,沒有出現(xiàn) console.logs。那么兩個問題:我明白為什么沒有被觸發(fā),因?yàn)樗呛虭click的組合。但為什么當(dāng)我長按時沒有觸發(fā)?@mousedown@mouseup@mousedown如何使用 Vue(或 JavaScript)在移動設(shè)備上定位長按?
查看完整描述

2 回答

?
慕雪6442864

TA貢獻(xiàn)1812條經(jīng)驗(yàn) 獲得超5個贊

MouseEvent當(dāng)輸入設(shè)備被觸摸時,偵聽器不會被觸發(fā),但TouchEvent偵聽PointerEvent器會被觸發(fā)。


PointerEvent是現(xiàn)在推薦的方式,因?yàn)樗w了所有輸入設(shè)備,包括鼠標(biāo)和觸摸:


<button

? v-if="!videoIsPlaying"

? @pointerdown="playVideo()"

></button>

長按閱讀:


<template>

? <button

? ? @pointerdown="isHolding = true"

? ? @pointerup="isHolding = false"

? ></button>

</template>


<script setup>

import { ref } from 'vue';


const isHolding = ref(false);

</script>


它們每個都有與 MouseEvent API 相似的事件,即touchstart=?mousedown

我個人發(fā)現(xiàn) TouchEvents 比 PointerEvents 更好,但是,您可能需要進(jìn)行一些測試才能確定哪種最適合您的情況。

因此,正如您對 Vue 所猜測的那樣,您可以使用@touchstart:


<button

? ? v-if="!videoIsPlaying"

? ? @click="playVideo()"

? ? @mousedown="playVideo()"

? ? @touchstart="playVideo()"

/>

如果您想將其確定為長按,則必須在 上存儲一個值touchstart并在 上更改它touchend:


<button

? ? @touchstart="touching = true"

? ? @touchend="touching = false"

/>

...

data() {

? ? return {

? ? ? ? touching: false

? ? }

}


查看完整回答
反對 回復(fù) 2023-07-14
?
慕田峪9158850

TA貢獻(xiàn)1794條經(jīng)驗(yàn) 獲得超8個贊

嘗試使用@contextmenu.prevent="func". 當(dāng)我按住手機(jī)上的某個元素時,這對我有用。但是,就像右鍵單擊一樣。



查看完整回答
反對 回復(fù) 2023-07-14
  • 2 回答
  • 0 關(guān)注
  • 169 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號