最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码

来源:动视网 责编:小采 时间:2020-11-27 22:04:10
文档

微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码

微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码:具体代码如下所示: // 1.scroll-y=true Y轴滚动 // 2.应该是设置了高才能行 // 3.使用scroll-top属性实现滚动到底部,scroll-top不要带单位 <scroll-view scroll-y=true style=height:{{height-50}}px; s
推荐度:
导读微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码:具体代码如下所示: // 1.scroll-y=true Y轴滚动 // 2.应该是设置了高才能行 // 3.使用scroll-top属性实现滚动到底部,scroll-top不要带单位 <scroll-view scroll-y=true style=height:{{height-50}}px; s


具体代码如下所示:

// 1.scroll-y="true" Y轴滚动 
// 2.应该是设置了高才能行
// 3.使用scroll-top属性实现滚动到底部,scroll-top不要带单位
<scroll-view scroll-y="true" style="height:{{height-50}}px;" 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标签实现自动滑动到底部功能的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

文档

微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码

微信小程序使用scroll-view标签实现自动滑动到底部功能的实例代码:具体代码如下所示: // 1.scroll-y=true Y轴滚动 // 2.应该是设置了高才能行 // 3.使用scroll-top属性实现滚动到底部,scroll-top不要带单位 <scroll-view scroll-y=true style=height:{{height-50}}px; s
推荐度:
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top