// scroll-view的代码 class名为sv 使用:style动态绑定高度
<scroll-view scroll-y="true" class="sv" :style="{height:navHeight+'px'}">
<view class="listItem" v-for="(item,index) in tvArry" :key="index" @click="skip">
<view class="leftBox">
<image :src="item.themb" class="leftImg"></image>
</view>
<view class="rightBox">
<view class="title">{{item.name}}</view>
<view class="sTitle">
{{item.name}}{{item.time}}
</view>
</view>
</view>
</scroll-view>
2.JS部分代码主要思路就是:通过屏幕可见高度-元素距离顶部的高度=屏幕剩余高度(元素高度);
data部分的代码:提前定义好接受数据的参数。
// data部分的代码
data() {
return {
pH:0, //窗口高度
navHeight:0, //元素的所需高度
}
},
onReady部分代码:每次刷新页面获取一次高度
onReady() {
let that=this;
uni.getSystemInfo({ //调用uni-app接口获取屏幕高度
success(res) { //成功回调函数
that._data.pH=res.windowHeight //windoHeight为窗口高度,主要使用的是这个
let titleH=uni.createSelectorQuery().select(".sv"); //想要获取高度的元素名(class/id)
titleH.boundingClientRect(data=>{
let pH=that._data.pH;
that._data.navHeight=pH-data.top //计算高度:元素高度=窗口高度-元素距离顶部的距离(data.top)
}).exec()
}
})
},
https://blog.csdn.net/qq_41906710/article/details/103628198
https://www.freesion.com/article/2175923322/