fix: loadmore

pages/index/index.vue

@@ -15,10 +15,26 @@
     </view>
 
     <!-- 新春提示栏 -->
-    <view class="notice-bar" @tap="goToOfficialAccount">
+    <view class="notice-bar">
       <view class="notice-left">
         <text class="notice-tag">新品</text>
-        <text class="notice-text">新春祝福上新品了，点击查看</text>
+        <swiper
+          class="notice-swiper"
+          vertical
+          autoplay
+          circular
+          interval="3000"
+          duration="500"
+        >
+          <swiper-item
+            v-for="(tip, index) in noticeList"
+            :key="index"
+            class="notice-swiper-item"
+            @tap="onNoticeTap(tip)"
+          >
+            <text class="notice-text">{{ tip.text }}</text>
+          </swiper-item>
+        </swiper>
       </view>
       <text class="notice-arrow">›</text>
     </view>
@@ -213,12 +229,26 @@ const useGreeting = () => {
   });
 };
 
-const goToOfficialAccount = () => {
-  // 跳转到公众号文章
-  // 替换为您实际的公众号文章链接
-  const articleUrl = "https://mp.weixin.qq.com/s/mK438jWsYzsccJ2dDJG15A";
+const noticeList = ref([
+  {
+    text: "新春祝福上新品了，点击查看",
+    url: "https://mp.weixin.qq.com/s/mK438jWsYzsccJ2dDJG15A",
+  },
+   {
+    text: "新春祝福上新品了3，点击查看",
+    url: "https://mp.weixin.qq.com/s/mK438jWsYzsccJ2dDJG15A",
+  },
+   {
+    text: "新春祝福上新品了3，点击查看",
+    url: "https://mp.weixin.qq.com/s/mK438jWsYzsccJ2dDJG15A",
+  },
+]);
+
+const onNoticeTap = (tip) => {
+  if (!tip.url) return;
+
    uni.navigateTo({
-    url: "/pages/webview/index?url=" + encodeURIComponent(articleUrl),
+      url: "/pages/webview/index?url=" + encodeURIComponent(tip.url),
     });
 };
 
@@ -450,6 +480,9 @@ onPullDownRefresh(async () => {
   .notice-left {
     display: flex;
     align-items: center;
+    flex: 1;
+    height: 40rpx;
+    overflow: hidden;
 
     .notice-tag {
       font-size: 20rpx;
@@ -459,11 +492,26 @@ onPullDownRefresh(async () => {
       border-radius: 6rpx;
       margin-right: 16rpx;
       font-weight: 700;
+      flex-shrink: 0;
+    }
+
+    .notice-swiper {
+      flex: 1;
+      height: 100%;
+
+      .notice-swiper-item {
+        display: flex;
+        align-items: center;
+        height: 100%;
+      }
     }
 
     .notice-text {
       font-size: 26rpx;
       color: #333;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
     }
   }