1.在製作小程序頁面當中我們肯定會遇到頁面滾動的問題,對於解決這樣的問題小程序已經給我們提供好組件
2.對於可滾動視圖區域,使用豎向滾動時,需要給一個固定高度,通過wxss設置heigh高度,組件屬性的長度單位默認爲px,
scroll-view鏈接
3.在小程序的.js文件中在data中進行定義相應的數據
windowHeight: 0,
//flow_head的高度
headHeight: 0,
// flow_info的高度
infoHeight: 0,
// scroll-view的高度
scrollViewHeight: 0
success: function(res) {
console.log(res)
that.setData({
windowHeight:res.windowHeight
})
}
});
let query = wx.createSelectorQuery().in(this);
頁面上其他盒子在當前頁面的高度
query.select('.flow_head').boundingClientRect();
query.select('.flow_info').boundingClientRect();
query.exec((res)=>{
// 分別取出headHeightr和infoHeight的高度
let headHeight = res[0].height;
let infoHeight = res[1].height;
console.log(headHeight,infoHeight)
// 然後就是做個減法
let scrollViewHeight = this.data.windowHeight - headHeight - infoHeight-70;
// 算出來之後存到data對象裏面,結果就是滾動區域的高度
that.setData({
scrollViewHeight: scrollViewHeight
});
})```