fix(square): use ref-binding for scrollTop reset; add bottom safety margin
This commit is contained in:
parent
751bd68bf1
commit
b0290456bb
@ -24,6 +24,13 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 内容区域: 内部 scroll -->
|
||||
<scroll-view
|
||||
class="content-scroll"
|
||||
scroll-y
|
||||
:show-scrollbar="false"
|
||||
:bounce="false"
|
||||
>
|
||||
<!-- 骨架屏 -->
|
||||
<view v-if="loading" class="grid-skeleton">
|
||||
<view v-for="i in 11" :key="i" class="skeleton-card">
|
||||
@ -114,6 +121,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -305,11 +313,21 @@ onUnmounted(() => {
|
||||
|
||||
<style scoped lang="scss">
|
||||
.hot-category-block {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
padding: 0 9.5rpx;
|
||||
border-radius: 24rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.content-scroll {
|
||||
flex: 1;
|
||||
min-height: 0; /* flex 子项需要 min-height: 0 才能正确伸缩 */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Tab 栏 —— 与 Figma Rectangle 90 (83:268) 一一对应 */
|
||||
.ranking-tabs {
|
||||
display: flex;
|
||||
@ -480,7 +498,11 @@ onUnmounted(() => {
|
||||
border-bottom-right-radius: 12px;
|
||||
border-bottom-left-radius: 12px;
|
||||
opacity: 0.8; /* 与 Figma 一致 */
|
||||
padding: 40rpx 20rpx 0;
|
||||
/* padding: 40rpx 20rpx 0; */
|
||||
/* 修复:原 80rpx 底部安全距离在 Task 2 被 .hot-category-wrapper 固定 height 替代,
|
||||
重新加上 32rpx 底部 padding 保证最后一行卡片不会紧贴 scroll-view 底边
|
||||
(避免与 BottomNav 的 fixed 区域视觉重叠)。 */
|
||||
padding: 40rpx 20rpx 32rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
@ -46,6 +46,7 @@
|
||||
<scroll-view
|
||||
class="content-wrapper"
|
||||
:scroll-y="activeContentTab === 'guangchang'"
|
||||
:scroll-top="outerScrollTop"
|
||||
:show-scrollbar="false"
|
||||
:bounce="false"
|
||||
@scroll="onScroll"
|
||||
@ -120,11 +121,14 @@ const showRankingModal = ref(false);
|
||||
const creationGridRef = ref(null);
|
||||
const cardTapTimers = {};
|
||||
const likingMap = ref({});
|
||||
// 外层 scroll-view 的 scrollTop 受控值:通过 ref 绑定实现程序化重置
|
||||
// (uni.pageScrollTo 操作的是 page 滚动条,不会作用于 <scroll-view>)
|
||||
const outerScrollTop = ref(0);
|
||||
|
||||
// 切 tab 时重置外层 scroll-view 的 scrollTop,避免残留滚动位置
|
||||
watch(activeContentTab, () => {
|
||||
// 星河/星榜 时 scroll-y=false,但 scrollTop 残留可能导致显示异常
|
||||
uni.pageScrollTo({ scrollTop: 0, duration: 0 });
|
||||
outerScrollTop.value = 0;
|
||||
});
|
||||
|
||||
// 统一 scroll 处理:驱动 CreationGrid 切 fixed
|
||||
|
||||
Loading…
Reference in New Issue
Block a user