uniapp 對于scroll-view滑動和頁面滑動的聯(lián)動處理方法
需求
遇到一個(gè)需求
解決方案
這個(gè)時(shí)候可以做一個(gè)內(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>
//通過整個(gè)頁面的滑動 來處理內(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)文章
JavaScript語句錯(cuò)誤throw、try及catch實(shí)例解析
這篇文章主要介紹了JavaScript語句錯(cuò)誤throw、try及catch實(shí)例解析,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-08-08深入理解JavaScript Promise鏈?zhǔn)秸{(diào)用與錯(cuò)誤處理機(jī)制
在JavaScript的異步編程中,Promise是一個(gè)非常重要的概念,它允許我們以鏈?zhǔn)降姆绞教幚懋惒讲僮?使得代碼更加清晰和易于管理,本文將通過一系列代碼示例,深入探討Promise的鏈?zhǔn)秸{(diào)用和錯(cuò)誤處理機(jī)制,需要的朋友可以參考下2024-09-09JavaScript躲避行星游戲?qū)崿F(xiàn)全程
本文將使用 canvas 創(chuàng)建一個(gè)躲避小行星游戲。另外將重點(diǎn)介紹的兩個(gè)方面是:如何使用 JavaScript 來檢測鍵盤輸入,以及如何在游戲中使用和處理 HTML5 音頻。希望你能夠喜歡2022-08-08JavaScript隊(duì)列數(shù)據(jù)結(jié)構(gòu)詳解
這篇文章主要介紹了JavaScript隊(duì)列數(shù)據(jù)結(jié)構(gòu)詳解,隊(duì)列是一種先進(jìn)先出的數(shù)據(jù)結(jié)構(gòu),隊(duì)列中允許兩種基礎(chǔ)操作,也就是插入和刪除,也就是入隊(duì)和出隊(duì)2022-07-07JavaScript自動設(shè)置IFrame高度的小例子
JavaScript自動設(shè)置IFrame高度的小例子,需要的朋友可以參考一下2013-06-06