微信小程序使用scroll-view標(biāo)簽實現(xiàn)自動滑動到底部功能的實例代碼

發(fā)布時間：2020-10-06 01:50:20 來源：腳本之家閱讀：421 作者：ICE小學(xué)生欄目：web開發(fā)

具體代碼如下所示：

// 1.scroll-y="true" Y軸滾動 
// 2.應(yīng)該是設(shè)置了高才能行
// 3.使用scroll-top屬性實現(xiàn)滾動到底部,scroll-top不要帶單位
<scroll-view scroll-y="true"  scroll-top="{{scrollTop}}">
 <block wx:for="{{recordList}}" wx:key="item.id">
 <view>
 <text>{{item.text}}</text>
 </view
 </block>
</scroll-view>

Page({
 data: {
 // 列表
 recordList：'',
 height: '',
 scrollTop: 0
 },
 onLoad: function (options) {
 // 獲取當(dāng)前窗口的高度
 var height = wx.getSystemInfoSync().windowHeight;
 // 下面的是我封裝的一個http請求
 App.HttpService.getReturnVisitRecordList(options.id).then(res => {
 //res 是請求成功后返回的數(shù)據(jù)
  if (res.data.code === 0) {
  var length = res.data.data.length
  that.setData({
  // 將獲取的List賦值給recordList
   'recordList': res.data.data,
   // 1.計算頁面上每一個item的標(biāo)簽的高
   // 2.用數(shù)組的獲取的List的長度*每個item標(biāo)簽的高度（400是我目測的，說白了就是瞎寫的，反正肯定比每個item的高度高，只要夠高就行。）
   'scrollTop': length * 400
  })
  }
 })
 }
})

總結(jié)

以上所述是小編給大家介紹的微信小程序使用scroll-view標(biāo)簽實現(xiàn)自動滑動到底部功能的實例代碼，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對億速云網(wǎng)站的支持！

向AI問一下細(xì)節(jié)

微信小程序使用scroll-view標(biāo)簽實現(xiàn)自動滑動到底部功能的實例代碼

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽