fix: preserve activity category width when fixed

pages/home.vue

@@ -38,7 +38,7 @@
 				<view class="c-box-title-right adfac" @click="toTurnPage('/pagesHome/allActivity',false)">更多 <up-icon name="arrow-right" size="30rpx" style="margin-left: 10rpx;"></up-icon></view>
 			</view>
 			<view class="c-box-typegrid-anchor" v-if="typeGrid.length" :style="isTypeGridSticky ? { height: typeGridHeight + 'px' } : null">
-			<view class="c-box-typegrid" :class="{ 'is-typegrid-sticky': isTypeGridSticky }" :style="isTypeGridSticky ? { top: mt + 'px' } : null">
+			<view class="c-box-typegrid" :class="{ 'is-typegrid-sticky': isTypeGridSticky }" :style="isTypeGridSticky ? { top: mt + 'px', left: typeGridLeft + 'px', width: typeGridWidth + 'px' } : null">
 				<swiper class="typegrid-swiper" :current="gridIndex" @change="e => gridIndex = e.detail.current" :duration="200" :circular="false" :disable-touch="false">
 					<swiper-item v-for="(page, pi) in typeGridPages" :key="pi">
 						<view class="typegrid-page">
@@ -132,6 +132,8 @@
 	const isTypeGridSticky = ref(false)
 	const typeGridOffsetTop = ref(0)
 	const typeGridHeight = ref(0)
+	const typeGridLeft = ref(0)
+	const typeGridWidth = ref(0)
 	// 进入页面默认查全部（categoryId 为空），点图标网格才切到具体分类
 	const queryParams = ref({
 		page:1,
@@ -219,6 +221,8 @@
 				if (!boxRect || !gridRect) return
 				typeGridOffsetTop.value = gridRect.top - boxRect.top
 				typeGridHeight.value = gridRect.height
+				typeGridLeft.value = gridRect.left
+				typeGridWidth.value = gridRect.width
 			})
 		})
 	}
@@ -381,8 +385,6 @@
 				background: #FFFFFF;
 				&.is-typegrid-sticky{
 					position: fixed;
-					left: 0;
-					right: 0;
 				}
 				.typegrid-swiper{
 					width: 100%;

tests/home-scroll-sticky-category.test.js

@@ -12,6 +12,8 @@ test('首页使用单一滚动容器并让两行活动分类吸顶', () => {
   assert.match(source, /<scroll-view class="c-box adffc"[^>]*scroll-y[^>]*@scroll="handleScroll"[^>]*@scrolltolower="scrolltolower"/)
   assert.match(source, /<view class="typegrid-page[\s\S]*?flex-wrap:\s*wrap/)
   assert.match(source, /isTypeGridSticky/)
+  assert.match(source, /typeGridWidth/)
+  assert.match(source, /width:\s*typeGridWidth\s*\+\s*'px'/)
   assert.match(source, /\.is-typegrid-sticky\s*\{[\s\S]*?position:\s*fixed/)
   assert.doesNotMatch(source, /position:\s*sticky/)
   assert.doesNotMatch(source, /<up-list[\s\S]*?@scrolltolower="scrolltolower"/)