微信小程序官方提供了一個(gè)可以設(shè)置滾動(dòng)條位置的方法scroll-top
在實(shí)際運(yùn)用過程中,發(fā)現(xiàn)設(shè)置了scroll-top無效,滾動(dòng)條位置并沒有發(fā)生變化,是因?yàn)槲⑿判〕绦虻墓俜娇蚣芴幱谛阅芸紤],初始化設(shè)置scroll-top不會(huì)重新渲染頁面,需要將scroll-top的是放在一個(gè)事件內(nèi)執(zhí)行才可以生效。
這里演示一個(gè)切換選項(xiàng)重置滾動(dòng)條事件的案例:文章來源:http://www.zghlxwxcb.cn/news/detail-509286.html
<scroll-view class="listDetail"
scroll-y="true"
bindscrolltolower="scrollLower"
scroll-top="{{scrollTop}}"
>
<view class="allDetail"></view>
</scroll-view>
data: {
// data內(nèi)不需要設(shè)置scrollTop
},
// 將scrollTop放在一個(gè)事件內(nèi)執(zhí)行,切換頁面重置滾動(dòng)條
navTabClick() {
this.setData({
scrollTop: 0
})
},
注意:
這種在data內(nèi)直接設(shè)置scrollTop初始化是無法生效的文章來源地址http://www.zghlxwxcb.cn/news/detail-509286.html
<scroll-view class="listDetail"
scroll-y="true"
bindscrolltolower="scrollLower"
scroll-top="{{scrollTop}}"
>
<view class="allDetail"></view>
</scroll-view>
data: {
scrollTop : 0
}
到了這里,關(guān)于微信小程序scroll-view組件設(shè)置 scroll-top無效問題解決的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!