在使用scroll-view组件下拉加载分页数据,发现bindscrolltolower 没有触发,原因是:scroll-view 元素的高度必须是设备的高度,单位且必须是px ,详情实现如下:
1 index.wxml添加scroll-view 组件
<scroll-view scroll-y="true" bindscrolltolower="loadInformations" style="height:{{scrollH}}px" scroll-into-view="allInformation" data-type="allInformation">
<view id="allInformation" class="section section-big">
<import src="../template/informationList.wxml" />
<template is="informationList" data="{{informations}}"></template>
</view>
</scroll-view>
重点是:style="height:{{scrollH}}px"
2 index.js 的onLoad 事件中 赋值scrollH
Page({
/**
* 页面的初始数据
*/
data: {
scrollH:0
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var self = this;
wx.getSystemInfo({
success: function(res) {
let scrollH = res.windowHeight;
self.setData({
scrollH:scrollH
});
}
});
}
})
3 在loadInformations 事件中加载分页数据