From 04af536d71fd2fdb7a6653d3b54a9a94ffaa6ee1 Mon Sep 17 00:00:00 2001 From: wangfukang <15630117759@163.com> Date: Thu, 30 Apr 2026 11:11:44 +0800 Subject: [PATCH] 1 --- package1/group/groupBuySingle.vue | 40 +++++++++++++++++++++---------- 1 file changed, 27 insertions(+), 13 deletions(-) diff --git a/package1/group/groupBuySingle.vue b/package1/group/groupBuySingle.vue index 110f7fe..a05759c 100644 --- a/package1/group/groupBuySingle.vue +++ b/package1/group/groupBuySingle.vue @@ -91,7 +91,9 @@ - + + + @@ -582,6 +584,8 @@ scrollIntoViewId: '', goodsListScrollTop: 0, isAutoScrolling: false, + isContainerSticky: false, + containerHeight: 0, pageScrollTop: 0, searchForm: { shopId: '', @@ -619,6 +623,17 @@ }, cartTotalPrice() { return this.cartItems.reduce((acc, curr) => acc + (curr.quantity * curr.price), 0).toFixed(2); + }, + containerStyle() { + if (this.isContainerSticky) { + // 吸顶时:fixed定位,精确计算高度 = 屏幕高度 - 导航栏高度 - 底部栏高度 + const sysInfo = uni.getSystemInfoSync(); + const bottomBarPx = Math.round(80 * sysInfo.windowWidth / 375); + const h = sysInfo.windowHeight - this.navBarHeight - bottomBarPx; + return 'display:flex;position:fixed;left:0;top:' + this.navBarHeight + 'px;width:100%;height:' + h + 'px;z-index:50;background:#F5F8F5;padding:0 2.5%;box-sizing:border-box;'; + } else { + return 'display:flex;height:72%;margin-top:20rpx;'; + } } }, filters: { @@ -707,16 +722,24 @@ if (rect) { this.containerOriginalTop = rect.top; this.menuListOffsetTop = rect.top; + this.containerHeight = rect.height; } }).exec(); }, 500); }, onPageScroll(e) { this.lastScrollTop = e.scrollTop; - console.log(e.scrollTop) // 当页面滚动到container应该触顶的位置时,启用吸顶 const stickyThreshold = this.containerOriginalTop - this.navBarHeight; - + if (e.scrollTop >= stickyThreshold && stickyThreshold > 0) { + if (!this.isContainerSticky) { + this.isContainerSticky = true; + } + } else { + if (this.isContainerSticky) { + this.isContainerSticky = false; + } + } }, methods: { // 页面touchmove事件:吸顶后阻止页面整体滑动(让goods-list接管滚动) @@ -1821,16 +1844,7 @@ border-radius: 20rpx; } - .container-sticky { - position: fixed; - left: 0; - width: 100%; - z-index: 50; - height: calc(100vh - 160rpx); - background: #F5F8F5; - padding: 0 2.5%; - box-sizing: border-box; - } + .goods-top { padding: 20rpx;