本文例項講述了微信小程式伺服器獲取資料列表渲染操作。分享給大家供大家參考，具體如下：

在實際專案開發中，有很多時候，前臺頁面的資料需要後臺伺服器傳遞過來。而前臺需要迴圈鋪值，類似如下頁面：

請求後臺資料：

wx.request({
   url: getApp().globalData.httpUrl + '/sys/group/selectGroupProList',//請求後臺地址
   data: {
    //請求後臺的分頁資料
    pageNum: that.data.page,pageSize: that.data.pageSize
   },method: "post",success(res) {
    console.log(res.data);
   }
})

後臺返回資料型別：

接下來是前臺頁面鋪值，在普通網站頁面鋪值的時候我會用到JS字串拼接技術，將資料拼到頁面，外面包一層for迴圈就可以迴圈鋪出這樣的列表頁面。現在在微信小程式中，我們可以在wxml裡面寫一部分js程式碼，將for迴圈寫在wxml中：

 <view bindtap="jumpPages" 
    wx:for="{{contentlist}}" 
    wx:key="{{index}}" 
    wx:for-index="index" 
    wx:for-item="item" 
  >
  <van-card
   num=" {{item.prjcount}}人 "
   price="課程小組"
   title="{{item.project_name}}" 
   desc="{{item.name}}"
   centered=true
   currency=""
   custom-class="custom-g"
   thumb-class="thumb"
   title-class="title-g"
   desc-class="desc-g"
  >
  </van-card>
 </view>

註釋：程式碼中的<van-card>是我引用的一個元件庫，此處不用考慮。

希望本文所述對大家微信小程式設計有所幫助。