。。。
rocyuan666
- 发布：2021-04-15 17:44
- 更新：2023-03-21 15:38
- 阅读：1538
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： 10.0.18363
HBuilderX类型： 正式
HBuilderX版本号： 3.1.9
手机系统： Android
手机系统版本号： Android 10
手机厂商： 华为
手机机型： 荣耀8x
页面类型： vue
打包方式： 云端
项目创建方式： HBuilderX
操作步骤：
预期结果：
。。。
。。。
实际结果：
。。。
。。。
bug描述：
请求到后台数据后，渲染视图（vm），需要获取渲染完成后元素的高度并滚动
封装的方法：
toTopHeight() {
const query = uni.createSelectorQuery()
query.select('#id-top-box').boundingClientRect((data => {
console.log(data, "#id-top-box data")
uni.pageScrollTo({
scrollTop: data.height,
duration: 0
});
})).exec()
},以上封装的方法，核心是调用的时候是需要在再次更新完视图后调用，也就是需要这样调用：
this.$nextTick(() => {
this.toTopHeight()
})有时无效...
我也发现this.$nextTick在页面渲染元素后，想获取元素高度获取不到，后来也是用setTimout才可以，我的部分代码是这样的
setTimeout(()=>{
if(item.remark){
let query = uni.createSelectorQuery();
let textHeight,wrapperHeight;
query.select(`.text-wrapper-${item.id}`).boundingClientRect(data=>{
wrapperHeight = data.height;
})
query.select(`.text-${item.id}`).boundingClientRect(data=>{
textHeight = data.height;
})
query.exec(res=>{
// 当文本内容高度大于父容器高度时，为溢出状态
if(textHeight > wrapperHeight){
item.isOverflowed = true;
}else{
item.isOverflowd = false;
}
})
}else {
item.isOverflowed = false;
}
})