修改装修tab分类

src/component/categoryTab/categoryTab.json

+{
+  "component": true,
+  "usingComponents": {
+    "product-list-style-one": "/component/productListStyleOne/productListStyleOne"
+  }
+}
\ No newline at end of file

src/component/categoryTab/categoryTab.wxml

+<!--component/tabSort/tabSort.wxml-->
+<view class="category-tab-container clear-box">
+    <view class="category-tab {{categoryTabFixed ? 'fixed' : ''}}">
+        <view class="scroll-view_H">
+          <view class="category-tab-item active">鞋子</view>
+            <view class="category-tab-item">裤子</view>
+            <view class="category-tab-item">帽子</view>
+            <view class="category-tab-item">衣服</view>
+            <view class="category-tab-item">衣服</view>
+            <view class="category-tab-item">衣服</view>
+            <view class="category-tab-item">衣服</view>
+            <view class="category-tab-item">衣服</view>
+        </view>
+    </view>
+    <!-- 商品列表 -->
+    <view class="product-list" wx:if="{{proData.length}}">
+      <product-list-style-one image-data="{{proData}}" />
+    </view>
+</view>
+

src/component/categoryTab/categoryTab.wxss

+/* component/tabSort/tabSort.wxss */
+.clear-box{
+  box-sizing: border-box;
+}
+.category-tab-container {
+    width: 100%;
+    height: auto;
+    background: #ffffff;
+}
+
+.category-tab-container .category-tab{
+  background: #ffffff;
+  height: 80rpx;
+  width: 100%;
+  border-bottom: solid 1rpx #dddddd;
+  position: sticky;
+}
+
+.category-tab-container .category-tab .scroll-view_H {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+    overflow-x: auto;
+}
+
+.category-tab-container .category-tab .scroll-view_H .category-tab-item{
+  flex: 1;
+  min-width: 20%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 28rpx;
+}
+
+.category-tab-container .category-tab .scroll-view_H .category-tab-item.active{
+  border-bottom: solid 4rpx var(--themecolor);
+  color: var(--themecolor);
+}
+
+.category-tab-container .category-tab.fixed{
+  /* position: fixed; */
+  z-index: 8;
+  /* left: 0; */
+  top: 0;
+}
+
+.category-tab-container .product-list{
+  background: #ffffff;
+}
\ No newline at end of file

src/pages/userCenter/userCenter.js

@@ -42,6 +42,7 @@ wxService.page({
     apiIsOk : true,
     //显示广告
     pageInfo : null,
+    categoryTabFixed : false,
   },
   /**
    * 生命周期函数--监听页面加载
@@ -89,7 +90,47 @@ wxService.page({
       }
     }
 
+    setTimeout(() => {
+      this.getElementTop();
+      // categoryTab
+    },300);
   },
+
+  //页面滚动
+  onPageScroll(e){
+    let scrollTop = e.scrollTop;
+    this.throttle(scoTop => {
+      if(scoTop > this.scrollTop){
+        this.data.categoryTabFixed = true;
+      }
+      else{
+        this.data.categoryTabFixed = false;
+      }
+      this.setData({
+        categoryTabFixed : this.data.categoryTabFixed
+      });
+    },null,0,scrollTop);
+  },
+
+  //节流器
+  throttle(fn, context, delay, text){
+    clearTimeout(fn.timeoutId)
+    fn.timeoutId = setTimeout(function () {
+      fn.call(context, text)
+    }, delay)
+  },
+
+  //获取元素到顶部的里
+  getElementTop(){
+    wx.createSelectorQuery().select('.categoryTab').boundingClientRect(res => {
+      if(res){
+        this.scrollTop = res.top;
+        this.categoryTabComponent = this.selectComponent('#categoryTab');
+        console.log(this.categoryTabComponent)
+      }
+    }).exec();
+  },
+
   ////获取位置信息并获取附近门店信息
   getMyLocationInfo() {
     let _this = this;

src/pages/userCenter/userCenter.json

@@ -7,6 +7,7 @@
     "pic-nav": "/component/picNav/picNav",
     "bottom": "/component/bottom/bottom",
     "tab-sort": "/component/tabSort/tabSort",
+    "category-tab": "/component/categoryTab/categoryTab",
     "announcement": "/component/announcement/announcement",
     "icon-swiper": "/component/iconSwiper/iconSwiper",
     "bannerAd": "/component/bannerAd/bannerAd",

src/pages/userCenter/userCenter.wxml

@@ -38,6 +38,7 @@
 			<tab-sort currHomePageId="{{currHomePageId}}" category-type="{{pItem.categoryType}}" 
       bind:getAuth="_getUserInfo" currentHasUserInfo="{{currentHasUserInfo}}" bind:updatePage="updatePage"/>
 		</view>
+		
 		<view class="" wx:if="{{pItem.type == 8}}">
 			<attention focus-wx="{{pItem.focusWx}}" />
 		</view>
@@ -45,6 +46,13 @@
 			<plus sku-list="{{skuVOList}}" plus-bgi="{{pItem.plus}}" 
       currentHasUserInfo="{{currentHasUserInfo}}" bind:updatePage="updatePage"/>
 		</view>
+		<!-- 分类组件 -->
+		<view class="categoryTab" wx:if="{{pItem.type == 7}}">
+			<category-tab currHomePageId="{{currHomePageId}}" categoryTab="{{pItem.categoryType}}" categoryTabFixed="{{categoryTabFixed}}"
+			id="categoryTab"
+      bind:getAuth="_getUserInfo" currentHasUserInfo="{{currentHasUserInfo}}" bind:updatePage="updatePage"/>
+		</view>
+
 	</block>
 </view>
 <guide-page-modal show="{{guidePageModalShow}}" />

src/project.config.json

@@ -26,7 +26,7 @@
 		"userConfirmedUseCompilerModuleSwitch": false
 	},
 	"compileType": "miniprogram",
-	"libVersion": "2.8.2",
+	"libVersion": "2.11.0",
 	"appid": "wxac09792264c49b5c",
 	"projectname": "%E5%BE%AE%E5%95%86%E5%9F%8E",
 	"debugOptions": {