circle page

nova-werun/components/circle/index.js

@@ -98,7 +98,6 @@ Component({
             Profilequery.skip(this.data.loadedItems);
             let P = await Profilequery.find();
             let profile1List = P.map(item => item.toJSON());
-            // profile1List.sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt));
             // 检查是否还有更多商品
             if (profile1List.length < this.data.pageSize) {
                 this.setData({

nova-werun/components/circle/index.wxml

@@ -5,7 +5,7 @@
         <block wx:for="{{cardList}}" wx:key="{{item.objectId}}">
             <circle-card objectId='{{item.objectId}}' type='surface'></circle-card>
         </block>
-        <view wx:if="{{noMoreItems}}" class="no-more">没有更多数据了</view>
+        <view wx:if="{{noMoreItems}}" class="no-more">没有更多动态了</view>
     </scroll-view>
     <view class="publishbox" bindtap="gourl" data-url="../../pages/circle/send-circle/index">
         <image src="https://file-cloud.fmode.cn/qpFbRRSZrO/20241105/8qes51030838243.png?imageView2/1/w/200/h/200"></image>

nova-werun/pages/circle/my-circle/index.js

@@ -17,6 +17,9 @@ Page({
 
         //朋友圈
         cardList: [],
+        loadedItems: 0, // 已加载的商品数量
+        pageSize: 6, // 每次加载的商品数量
+        noMoreItems: false, // 是否还有更多商品
     },
 
     /**
@@ -106,15 +109,33 @@ Page({
         Profilequery.equalTo('isVisible', true);
         Profilequery.notEqualTo('isDeleted', true)
         Profilequery.equalTo('profile', profile1List2[0].objectId);
-
+        Profilequery.descending('createdAt');
+        // 设置查询的限制和偏移
+        Profilequery.limit(this.data.pageSize);
+        Profilequery.skip(this.data.loadedItems);
         let P = await Profilequery.find();
         let profile1List = P.map(item => item.toJSON());
-        profile1List.sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt));
-        console.log(profile1List);
+        // 检查是否还有更多商品
+        if (profile1List.length < this.data.pageSize) {
+            this.setData({
+                noMoreItems: true
+            });
+        } else {
+            this.setData({
+                noMoreItems: false
+            });
+        }
+
         this.setData({
-            cardList: profile1List
+            cardList: this.data.cardList.concat(profile1List),
+            loadedItems: this.data.loadedItems + profile1List.length
         })
         console.log(this.data.cardList);
     },
-
+    loadMoreData: async function () {
+        // 触底时加载更多数据
+        if (!this.data.noMoreItems) {
+            await this.getcircle();
+        }
+    },
 })

nova-werun/pages/circle/my-circle/index.less

@@ -6,8 +6,14 @@
     .trends{
         width: 100%;
         border-top: grey solid 1px;
-        overflow-y: scroll;
         padding-top: 20rpx;
+        .no-more{
+            width: 100%;
+            display: flex;
+            justify-content: center;
+            font-size: 28rpx;
+            margin-bottom: 35rpx;
+        }
     }
     .trends::-webkit-scrollbar {
         display: none; /* 隐藏滚动条 */

nova-werun/pages/circle/my-circle/index.wxml

@@ -1,9 +1,10 @@
 <!--nova-werun/pages/my-circle/index.wxml-->
 <nav type="back" title="我的动态" background-color="{{'#87ceeb'}}" front-color="{{'#ffffff'}}"></nav>
 <view class="all" style="height: {{contentHeight}}rpx;">
-    <view class="trends" style="height: {{contentHeight}}rpx;">
+    <scroll-view class="trends" scroll-y="true" bindscrolltolower="loadMoreData" style="height: {{contentHeight}}rpx;">
         <block wx:for="{{cardList}}" wx:key="{{item.objectId}}">
             <circle-card  objectId='{{item.objectId}}' type='surface' permission='delete'></circle-card>
         </block>
-    </view>
+        <view wx:if="{{noMoreItems}}" class="no-more">没有更多动态了</view>
+    </scroll-view>
 </view>

nova-werun/pages/circle/my-circle/index.wxss

@@ -1 +1 @@
-.all{width:100vw;position:relative}.all .trends{width:100%;border-top:grey solid 1px;overflow-y:scroll;padding-top:20rpx}.all .trends::-webkit-scrollbar{display:none}
+.all{width:100vw;position:relative}.all .trends{width:100%;border-top:grey solid 1px;padding-top:20rpx}.all .trends .no-more{width:100%;display:flex;justify-content:center;font-size:28rpx;margin-bottom:35rpx}.all .trends::-webkit-scrollbar{display:none}