使用vue-touch報(bào)priority錯(cuò)誤的解決
解決vue-touch報(bào)priority錯(cuò)誤
用vue2.0開發(fā)的項(xiàng)目需要安裝的是vue-touch版本2：vue-touch@next ；vue-touch安裝的則是版本1，加上next安裝的版本才是2；vue2.0及以上需要使用vue-touch 2.0
使用vue-touch遇到的坑
會(huì)使手機(jī)列表不能滑動(dòng)
vue-touch的好與坑
開發(fā)web移動(dòng)頁面時(shí)，突然發(fā)現(xiàn)列表不能滑動(dòng)了，差點(diǎn)認(rèn)為是兼容問題。。。主要是在使用vue-touch時(shí)它都沒出現(xiàn)問題，然后過了過了一段時(shí)間突然出現(xiàn)了。。。排查問題排查的心累。。。
當(dāng)時(shí)想讓移動(dòng)端可以左右滑動(dòng)來切換上下頁，然后百度到vue-touch這個(gè)小可愛。只用幾行代碼就實(shí)現(xiàn)了左右切換，當(dāng)時(shí)可高興了。。。可萬萬沒想到，它后面坑了我一把。。。
后面各種排查，各種百度，有些大佬說可能是js阻止了默認(rèn)事件，也有可能是父元素加了overflow:hidden。然后我一一試過了，都沒用。。。
后來突然發(fā)現(xiàn)可能是vue-touch的原因。然后針對(duì)vue-touch百度，果然，就是這個(gè)小妖精在折磨我。
**vue-touch的好**：vue-touch可實(shí)現(xiàn)在移動(dòng)端手勢(shì)滑動(dòng)，可觸發(fā)我們想要的事件。這樣我們就可以實(shí)現(xiàn)我們?cè)谝苿?dòng)端手勢(shì)操作想觸發(fā)的事件了，vue-touch有哪些用法，可自行百度，萬能的百度有很多文章。
**vue-touch的坑**：它會(huì)給組件添加一個(gè)touch-action:none;這個(gè)會(huì)禁止用戶的所有手勢(shì)操作?。。。ㄟ@樣就不能上下滑動(dòng)了?。。。?/p>
解決方法
樣式里加一個(gè)touch-action:pay-y!important就可以了
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
訪問百度音樂API需要傳遞音樂類型參數(shù)，而這些參數(shù)是存在musictype.json中，現(xiàn)在在組件listcate.vue需要獲取json數(shù)據(jù)，如何實(shí)現(xiàn)呢，下面小編給大家?guī)砹薞ue中如何獲取json文件中的數(shù)據(jù)，感興趣的朋友一起看看吧2022-09-09
本篇文章主要介紹了jquery在vue腳手架中的使用方式示例，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-08-08
這篇文章主要介紹了vue3使用深度選擇器修改樣式問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
vue3如何添加eslint校驗(yàn)(eslint-plugin-vue)
這篇文章主要介紹了vue3如何添加eslint校驗(yàn)(eslint-plugin-vue),具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-01-01
Vue ECharts設(shè)置主題實(shí)現(xiàn)方法介紹
這篇文章主要介紹了Vue ECharts設(shè)置主題，本文通過實(shí)例代碼圖文相結(jié)合給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-12-12
本篇文章主要介紹了vue之nextTick全面解析，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-05-05
vue執(zhí)行配置選項(xiàng)npm?run?serve的本質(zhì)圖文詳解
本地開發(fā)一般通過執(zhí)行npm run serve命令來啟動(dòng)項(xiàng)目,那這行命令到底存在什么魔法?下面這篇文章主要給大家介紹了關(guān)于vue執(zhí)行配置選項(xiàng)npm?run?serve的本質(zhì)的相關(guān)資料,需要的朋友可以參考下2023-05-05
這篇文章主要介紹了vue 使用vue-i18n做全局中英文切換的實(shí)現(xiàn)方法，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值 ,需要的朋友可以參考下2018-10-10
Vue前端利用slice()方法實(shí)現(xiàn)分頁器
分頁功能是常見的需求之一，本文主要介紹了Vue前端利用slice()方法實(shí)現(xiàn)分頁器，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07
構(gòu)建Vue大型應(yīng)用的10個(gè)最佳實(shí)踐(小結(jié))
這篇文章主要介紹了構(gòu)建Vue大型應(yīng)用的10個(gè)最佳實(shí)踐(小結(jié)),文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11