每日一嘮叨:
測試小姐姐說給說明文檔加個(gè)滾動(dòng)功能吧满葛,不要讓用戶還手動(dòng)滑那么長時(shí)間磨淌,直接點(diǎn)擊跳到說明位置好了。
okay龙巨。
正文開始??
需求:實(shí)現(xiàn)點(diǎn)擊說明標(biāo)題滾動(dòng)到說明詳情。
效果圖
uni app官網(wǎng)說法
代碼
JS:
//提示滾動(dòng)到固定位置上
roll(){
uni.createSelectorQuery().select('.hint_zt').boundingClientRect(data=>{//目標(biāo)位置的節(jié)點(diǎn)熊响,類class或者id
console.log("目標(biāo)view的top\left\right\bottom分別是多少",data.top,data.left,data.right,data.bottom)
uni.pageScrollTo({
duration: 100,//過渡時(shí)間
scrollTop: data.top,//到達(dá)目標(biāo)class的top值
})
}).exec();
},
打印數(shù)據(jù)
在點(diǎn)擊事件那里引用這個(gè)方法即可旨别!