长列表

@@ -13,6 +13,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
+    "miniprogram-recycle-view": "^0.1.2",
     "mta-wechat-analysis": "^1.3.7"
   }
 }

 // pages/me/follow.js
 import util from '../../utils/util';
 import App from '../../utils/api';
-const {regeneratorRuntime} = global
+const createRecycleContext = require('miniprogram-recycle-view')
 Page({
 
   /**
@@ -16,6 +16,21 @@ Page({
    * 生命周期函数--监听页面加载
    */
   options:null,
+  ctx:null,
+  onReady: function() {
+    this.ctx = createRecycleContext({
+      id: 'recycleId',
+      dataKey: 'sellers',
+      page: this,
+      itemSize: { // 这个参数也可以直接传下面定义的this.itemSizeFunc函数
+        width: 337,
+        height: 150
+      }
+    })
+    // ctx.append(newList)
+    // ctx.update(beginIndex, list)
+    // ctx.destroy()
+  },
   onLoad: function (options) {
     //latitude=34.215637&longitude=108.891264&scale=16&height=397
     this.options=options
@@ -39,12 +54,6 @@ Page({
       sellers:sellers
     })
   },
-  /**
-   * 生命周期函数--监听页面初次渲染完成
-   */
-  onReady: function () {
-
-  },
 
   /**
    * 生命周期函数--监听页面显示
@@ -84,7 +93,12 @@ Page({
    * 页面上拉触底事件的处理函数
    */
   onReachBottom: function (e) {
-    console.log(e)
+    // console.log(e)
+    // if(this.hasMore){
+    //   this.GetCollectionSellerList();
+    // }
+  },
+  scrollToLower(){
     if(this.hasMore){
       this.GetCollectionSellerList();
     }
@@ -124,9 +138,10 @@ Page({
         }
         seller.hasFollow=true
       })
+      this.ctx.append(sellers)
       sellers=[...this.data.sellers,...sellers]
       this.setData({
-        sellers:sellers,
+        //sellers:sellers,
         hasMore:this.hasMore,
       })
       this.sellers=sellers

@@ -6,6 +6,8 @@
     "formids":"/components/formids/formids",
     "nav":"/components/nav/nav",
     "getpos":"/components/userinfo/getpos",
-    "sb-tr":"/components/reserve/seller-box-transverse/seller-box"
+    "sb-tr":"/components/reserve/seller-box-transverse/seller-box",
+    "recycle-view": "miniprogram-recycle-view/recycle-view",
+    "recycle-item": "miniprogram-recycle-view/recycle-item"
   }
 }
\ No newline at end of file

 <!--pages/reserve/discount.wxml-->
 <nav>特惠榜</nav>
-<image class="banner"
-        src="http://qn.colorcun.com/reserve/images/%E7%B2%BE%E9%80%89%E6%8A%98%E6%89%A3.png"></image>
 <view class="pages">
     <view class="follow">
+        <!--
         <view class="seller" wx:for="{{sellers}}" wx:key="sellers.key"
               bindtap="gotoDetail" data-sid="{{item.id}}" wx:if="{{item.hasFollow}}">
             <sb-tr seller="{{item}}"
                    hasActivity="{{true}}" hasAverage="{{false}}"
                    hasSlogan="{{true}}" sellerStyle="noborder noshadow"></sb-tr>
         </view>
-        <view class="flex-vc" wx:if="{{!hasMore}}">没有更多了</view>
+        -->
+        <recycle-view batch="{{batchSetRecycleData}}" id="recycleId" bindscrolltolower="scrollToLower">
+            <view slot="before">
+                <image class="banner"
+                       src="http://qn.colorcun.com/reserve/images/%E7%B2%BE%E9%80%89%E6%8A%98%E6%89%A3.png"></image>
+            </view>
+            <recycle-item wx:for="{{sellers}}" wx:key="sellers.key"
+                          class="seller" style="width: 90%;"
+                          bindtap="gotoDetail" data-sid="{{item.id}}" wx:if="{{item.hasFollow}}">
+                <sb-tr seller="{{item}}"
+                       hasActivity="{{true}}" hasAverage="{{false}}"
+                       hasSlogan="{{true}}" sellerStyle="noborder noshadow"></sb-tr>
+            </recycle-item>
+            <view slot="after"><view class="flex-vc" wx:if="{{!hasMore}}">没有更多了</view></view>
+        </recycle-view>
     </view>
 </view>
 <getpos bindpos="onpos" id="getpos" hasAllowFail></getpos>
\ No newline at end of file