具体代码如下所示:
// 1.scroll-y="true" Y轴滚动
// 2.应该是设置了高才能行
// 3.使用scroll-top属性实现滚动到底部,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) {
// 获取当前窗口的高度
var height = wx.getSystemInfoSync().windowHeight;
// 下面的是我封装的一个http请求
App.HttpService.getReturnVisitRecordList(options.id).then(res => {
//res 是请求成功后返回的数据
if (res.data.code === 0) {
var length = res.data.data.length
that.setData({
// 将获取的List赋值给recordList
'recordList': res.data.data,
// 1.计算页面上每一个item的标签的高
// 2.用数组的获取的List的长度*每个item标签的高度(400是我目测的,说白了就是瞎写的,反正肯定比每个item的高度高,只要够高就行。)
'scrollTop': length * 400
})
}
})
}
})
总结
以上所述是小编给大家介绍的微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对亿速云网站的支持!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。