微信小程序豆瓣项目Day3

点击更多显示影视数据列表

我们在在设置点击更多的时候，是传入的type类型来显示不同的分类影视数据。

1wxml

<!--pages/list/list.wxml-->
<view class="listBox">
  <itemBox wx:for="{{listData}}" wx:key="{{item.title}}" item="{{item}}" itemurl="/pages/detail/detail?type={{type}}&id={{item.id}}"></itemBox>
</view>

css
/* pages/list/list.wxss */
.listBox{
width: 660rpx;
margin: 30rpx auto;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-start;
}

json 中加入了上拉加载
“usingComponents”: {
“itemBox”: “/componets/itemBox/itemBox”
},
“onReachBottomDistance”: 100

js：

// pages/list/list.js
import { urlList } from '../../utils/url'
import { netWork } from '../../utils/net'
var current = 1;
Page({

  /**
   * 页面的初始数据
   */
  data: {
    num:9
  },
  // 上拉加载
  loadData: function (num,type) {
    var that = this
    if(type == 'movie')
    {
      netWork.listData({
        url: urlList[0],
        num: num * current,
        success(data) {
          that.setData({
            listData: data.data.subject_collection_items
          })
          // console.log(that.data.movies)
        }
      })
    }else if(type == 'tv')
    {
      netWork.listData({
        url: urlList[1],
        num: num * current,
        success(data) {
          that.setData({
            listData: data.data.subject_collection_items
          })
          // console.log(that.data.movies)
        }
      })
    }else if(type == 'tvshow')
    {
      that.setData({
        type: 'tv'
      })
      netWork.listData({
        url: urlList[2],
        num: num * current,
        success(data) {
          that.setData({
            listData: data.data.subject_collection_items
          })
          // console.log(that.data.movies)
        }
      })
    }
    
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    console.log(options.type);
    current=1
    // var that = this
    this.setData({
      type:options.type
    })
    this.loadData(this.data.num,this.data.type) 
  },
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    current++;
    this.loadData(this.data.num,this.data.type) 
  },
})