輪播圖

<view>
  <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" class="banners" interval="{{interval}}" duration="{{duration}}">
    <block wx:for="{{zhihu}}" wx:key="id">
      <swiper-item class="banner">
        <image src="{{item.images}}" data-id="{{item.b}}" bindtap="bindViewTap" class="banner-image" width="100%" height="100%" />
        <text class="banner-title">{{item.title}}</text>
        <text>{{item.ga_prefix}}</text>
      </swiper-item>
    </block>
  </swiper>
</view>
 

<view class="type-container">
  <scroll-view class="type-navbar" scroll-x="true">
    <view class="type-box" wx:for-items="{{zhuxin}}" wx:key="id">
      <view id="{{item.id}}" class="type-navbar-item"  bindtap="tabClick">
        {{item.name}}
      </view>
    </view>
  </scroll-view>
</view>
 

// pages/classroom/classroom.js
Page({

  /**
   * 頁面的初始資料
   */
  data: {
    duration: 2000,
    indicatorDots: true,
    autoplay: true,
    interval: 3000,
    loading: false,
    plain: false,
  },

  /**
   * 生命週期函式--監聽頁面載入
   */
  onLoad: function (options) {
    var that = this //不要漏了這句，很重要
    wx.request({
      url: 'http://news-at.zhihu.com/api/4/news/latest',
      headers: {
        'Content-Type': 'application/json'
      },
      success: function (res) {
        //將獲取到的json資料，存在名字叫zhihu的這個陣列中
        that.setData({
          zhihu: res.data.stories,
          //res代表success函式的事件對，data是固定的，stories是是上面json資料中stories
        })
      }
    }),

      wx.request({
        url: 'http://www.*********.com/mapi_v2/Category/getClassRoomCategories',
        headers: {
          'Content-Type': 'application/json'
        },
        success: function (res) {
          //將獲取到的json資料，存在名字叫zhuxin的這個陣列中
          that.setData({
            zhuxin: res.data,
          })
        }
      })
  },

  /**
   * 生命週期函式--監聽頁面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命週期函式--監聽頁面顯示
   */
  onShow: function () {

  },

  /**
   * 生命週期函式--監聽頁面隱藏
   */
  onHide: function () {

  },

  /**
   * 生命週期函式--監聽頁面解除安裝
   */
  onUnload: function () {

  },

  /**
   * 頁面相關事件處理函式--監聽使用者下拉動作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 頁面上拉觸底事件的處理函式
   */
  onReachBottom: function () {

  },

  /**
   * 使用者點選右上角分享
   */
  onShareAppMessage: function () {

  },

})