我在movable-view里显示一个后台获取的列表,在获取数据之后通过selectorQuery获取每个分类(ingredientCategory)的高度,加起来之后设置到movable-view的高度上。
开发工具和安卓真机上都没问题,iOS上差距巨大。正常应该是1702px高度的时候iOS上获取回来只有284.9357px,而且<view class="categoryTitleBlock>在页面上显示的高度是0,但是这个类的高度在css里写了的是80rpx。
已经尝试过了在this.setData({})的回调里设置高度,也试了回调里设置setTimeOut再设置高度,问题依旧,请问怎么解决?谢谢!
wxml
<movable-area>
<movable-view style="height: {{panelHeight}}px">
<view class="ingredientCategory" wx:for="{{ingredientList}}" wx:for-index="cat">
<view class="categoryTitleBlock">
<text class="titleText" style="margin-left: 30rpx">{{item.c.name}}</text>
</view>
<ingredient class="ingredient" wx:for="{{item.f}}" wx:for-index="food"ingredient="{{item}}"></ingredient>
</view>
<view class="ingredientCategory">...</view>
<view class="ingredientCategory">...</view>
</movable-view>
</movable-area>
自适应高度js
setPanelHeight: function() {
this.createSelectorQuery().selectAll('.ingredientCategory').fields({
computedStyle: ['height']
}, res => {
if (!res) {
console.log('no selection')
return
}
console.log(res)
let height = 0
for (let i = 0; i < res.length; i++) {
height += Number(res[i].height.slice(0, -2))
}
this.setData({
panelHeight: height + 340
})
console.log(height)
}).exec()
},
网友回复
社区技术运营专员-壹君:
你好,麻烦提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)