uniapp scollview ios中,因为用了 position: sticky;,内容可拖动,但是拖动内容到极致的时候,盒子也拖动了,脱离了吸边问题
时间: 2024-04-14 15:30:17 浏览: 23
你可以尝试在滚动容器外包裹一个固定高度的容器,并将其设置为`overflow: hidden`,这样当内容被拖动到极致时,容器不会脱离吸边。以下是一个示例代码:
```html
<template>
<view class="container">
<view class="scroll-wrapper">
<scroll-view class="scroll-view" scroll-y>
<!-- 内容 -->
</scroll-view>
</view>
</view>
</template>
<style>
.container {
height: 100vh;
overflow: hidden;
}
.scroll-wrapper {
height: calc(100vh - 50px); /* 减去底部导航栏高度 */
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
.scroll-view {
position: sticky;
top: 0;
}
</style>
```
在示例中,我们将整个页面的高度设置为100vh,并将容器的overflow属性设置为hidden。scroll-wrapper作为滚动容器,设置了固定的高度和overflow-y属性。在滚动容器内,我们使用scroll-view来实现内容可滚动,同时将其设置为sticky,并将其顶部定位为0,这样内容就可以吸附在顶部了。请根据你的具体情况调整代码中的高度值和样式。希望对你有帮助!如果还有其他问题,请随时提问。