https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html
<!--消息列表 -->
<view
class="box-list-wrap"
style="height:calc(100% - {{chatInputHeight}}px - {{navigatorNarHeight}}px)"
>
<scroll-view class="message-list-wrap" catchtap="scrollViewHandle">
<messageList
id="MessageList-component"
chatInfo="{{chatInfo}}"
messageList="{{messageList}}"
bind:messageReceived="messageReceived"
></messageList>
</scroll-view>
</view>
不是很清楚,你上面减少的变量高度是否正确,建议使用 flex: 1; 自适应高度而不是去用100%去减少其它模块的高度,这样的好处就是你不用去定义其它的元素高度了,完全根据剩余距离撑满
<view class="" style="display: flex;flex-direction: column;justify-content: space-between;height: 100vh;"> <view class="" style="width: 100%;"> <!-- 我是顶部无具体高的内容(可动态高度) --> </view> <scroll-view scroll-y style="width: 100%;overflow-y: auto;flex:1"> <!-- overflow-y: auto;flex:1;很重要,否则无法滑动和自定义适配高度 --> <!-- 我是无根据其它同级元素自定义适配的高度滑块 --> </scroll-view> <view class="" style="width: 100%;"> <!-- 我是底部无具体高的内容(可动态高度) --> </view> </view>