1

src/pages/assistingAgriculture/index/index.vue

@@ -37,6 +37,7 @@
       </view>
       <view class="sort">
         <view style="display: flex; flex-direction: row">
+          <scroll-view class="box-red" scroll-x="true" @scroll="scroll">
             <view
               class="borderClass"
               @click="toBuilding(item)"
@@ -46,6 +47,7 @@
               <image mode="aspectFill" :src="item.icon" style="width: 96rpx; height: 96rpx" />
               <view class="sort-text">{{ item.categoryName }}</view>
             </view>
+          </scroll-view>
         </view>
       </view>
       <view class="product-page" v-for="(item, index) in list" :key="index">
@@ -109,7 +111,7 @@ const getList = () => {
     res.data.forEach((item) => {
       item.icon = import.meta.env.VITE_APP_IMG_URL + item.pic;
     });
-    sortList.value = res.data.splice(0, 4);
+    sortList.value = res.data;
   });
 };
 // 筑农严选首页-分类预售商品列表
@@ -205,11 +207,16 @@ page {
   height: 186rpx;
   background: linear-gradient(180deg, #82ce8b -39%, #ffffff 36%);
 }
+.box-red {
+  white-space: nowrap;
+  width: 100%;
+}
 .borderClass {
   width: 96rpx;
   height: 96rpx;
-  margin-left: 75rpx;
+  margin: 0 36rpx;
   margin-top: 22rpx;
+  display: inline-block;
 }
 .sort-text {
   font-size: 24rpx;