uniapp 對于scroll-view滑動和頁面滑動的聯(lián)動處理方法
更新時間：2024年08月15日 09:37:53 作者：新生代農(nóng)民工-小王八
這篇文章主要介紹了uniapp 對于scroll-view滑動和頁面滑動的聯(lián)動處理方法,本文通過示例代碼給大家介紹的非常詳細(xì),感興趣的朋友一起看看吧
需求
遇到一個需求
解決方案
這個時候可以做一個內(nèi)頁面滑動判斷
<!-- scroll-y 做true或者false的判斷是否滑動 --> <view class="u-menu-wrap" style="background-color: #fff;"> <scroll-view :scroll-y="data.isGo" scroll-with-animation class="u-tab-view menu-scroll-view" :scroll-top="data.scrollTop" :scroll-into-view="data.itemId"> </scroll-view> </view>
//通過整個頁面的滑動 來處理內(nèi)頁面是否滑動
onPageScroll((e)=>{
// e.scrollTop 表示當(dāng)前頁面滾動的距離 單位px
console.log('頁面滾動距離：', e.scrollTop);
if (e.scrollTop == 204) {
data.isGo = true
} else {
data.isGo = false
}
})效果圖
商品列表參考代碼 :src/pages/template/mallMenu/index2.vue · jry/uview-plus - 碼云 - 開源中國 (gitee.com)
到此這篇關(guān)于uniapp 對于scroll-view滑動和頁面滑動的聯(lián)動處理的文章就介紹到這了,更多相關(guān)uniapp scroll-view頁面滑動聯(lián)動內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了JS實現(xiàn)旋轉(zhuǎn)木馬式圖片輪播效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-01-01
JS獲得選取checkbox整行數(shù)據(jù)的方法
這篇文章主要介紹了JS獲得選取checkbox整行數(shù)據(jù)的方法,涉及使用js對DOM節(jié)點的操作技巧,非常具有實用價值,需要的朋友可以參考下2015-01-01
這篇文章主要介紹了微信小程序之 catalog 切換實現(xiàn)解析,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-09-09
下面小編就為大家?guī)硪黄肑S屏蔽頁面中的Enter按鍵提交表單的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-11-11
JavaScript查找文章中的高頻單詞的多種實現(xiàn)方案
本文將詳細(xì)介紹如何使用 JavaScript 查找一篇文章中出現(xiàn)頻率最高的單詞,包括完整的代碼實現(xiàn)、多種優(yōu)化方案以及實際應(yīng)用場景,感興趣的小伙伴跟著小編一起來看看吧2025-04-04
Javascript對象中關(guān)于setTimeout和setInterval的this介紹
Javascript對象中關(guān)于setTimeout和setInterval的this介紹，需要的朋友可以參考下2012-07-07
layui實現(xiàn)數(shù)據(jù)表格隱藏列的示例
今天小編就為大家分享一篇layui實現(xiàn)數(shù)據(jù)表格隱藏列的示例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-10-10
JavaScript實現(xiàn)Java中StringBuffer的方法
這篇文章主要介紹了JavaScript實現(xiàn)Java中StringBuffer的方法,實例分析了StringBuffer類的實現(xiàn)與使用技巧,需要的朋友可以參考下2015-02-02
這篇文章主要介紹了JS實現(xiàn)的貪吃蛇游戲,結(jié)合具體案例形式分析了javascript實現(xiàn)貪吃蛇的相關(guān)步驟、原理、算法操作技巧與相關(guān)注意事項,需要的朋友可以參考下2019-05-05
這篇文章主要介紹了如何基于viewport vm適配移動端頁面,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-11-11