小程序 swiper banner 圖片 居中

 

var imgUrlApp = getApp().globalData.imgUrlApp;
Page({
  /**
   * 頁面的初始數據
   */
  data: {
    indicatorDots: true,
    vertical: false,
    autoplay: false,
    circular: false,
    interval: 2000,
    duration: 500,
    previousMargin: 0,
    nextMargin: 0,
    imgUrlApp: imgUrlApp,
    swiperimgUrls: ['http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg',
      'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg'
    ],
    userinfo: {},
    companyinfo: {}
  },

  /**
   * 生命周期函數--監聽頁面加載
   */
  onLoad: function(options) {
    var that = this;
    console.log(
        wx.getStorageSync("username")),
      wx.request({
        url: getApp().globalData.apiUrlApp + 'acc/get_userinfo/',
        header: {
          "Content-Type": "application/x-www-form-urlencoded",
          'cookie': wx.getStorageSync("username"), //讀取cookie,
          'cookie': wx.getStorageSync("uid"), //讀取cookie,
          'cookie': wx.getStorageSync("gid") //讀取cookie,

        },
        method: "GET",
        data: {
          username: wx.getStorageSync("username")
        },
        success: function(res) {
          console.log(res)
          if (res.data.status == 1) {
            wx.showToast({
                // title: res.data.info,
                title: "帳號詳情",
                icon: 'success',
                duration: 1500
              }),
              that.setData({
                userinfo: res.data.data
              }),
              wx.request({
                url: getApp().globalData.apiUrlApp + 'common/get_orginfo/',
                header: {
                  "Content-Type": "application/x-www-form-urlencoded",
                  'cookie': wx.getStorageSync("username"), //讀取cookie,
                  'cookie': wx.getStorageSync("uid"), //讀取cookie,
                  'cookie': wx.getStorageSync("gid") //讀取cookie,

                },
                method: "GET",
                data: {
                  uid: wx.getStorageSync("uid")
                },
                success: function(res) {
                  console.log(res)
                  if (res.data.status == 1) {
                    wx.showToast({
                        // title: res.data.info,
                        title: "帳號詳情",
                        icon: 'success',
                        duration: 1500
                      }),
                      that.setData({
                        companyinfo: res.data.data
                      })
                  } else if (res.data.status == 0) {
                    wx.showToast({
                      title: "無數據返回",
                      icon: 'success',
                      duration: 1500
                    })
                  } else if (res.data.status == -1) {
                    wx.showToast({
                      title: "請求異常，請檢查重試",
                      icon: 'loading',
                      duration: 2000
                    })
                  }
                }
              })
          } else if (res.data.status == 0) {
            wx.showToast({
              title: "無數據返回",
              icon: 'success',
              duration: 1500
            })
          } else if (res.data.status == -1) {
            wx.showToast({
              title: "請求異常，請檢查重試",
              icon: 'loading',
              duration: 2000
            })
          }
        }
      })
  },

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

  },

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

  },

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

  },

  /**
   * 生命周期函數--監聽頁面卸載
   */
  onUnload: function() {

  },

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

  },

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

  },

  /**
   * 用戶點擊右上角分享
   */
  onShareAppMessage: function() {

  },

  onShow: function() {
    // 頁面顯示  
  },
  onHide: function() {
    // 頁面隱藏  
  },
  onUnload: function() {
    // 頁面關閉  
  },
})

 

@import "../../style/weui.wxss";

　　

<view class="mainpage">
  <view class="banner">
    <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" circular="{{circular}}" vertical="{{vertical}}" interval="{{interval}}" duration="{{duration}}" previous-margin="{{previousMargin}}px" next-margin="{{nextMargin}}px">
      <block wx:for="{{swiperimgUrls}}" wx:key="*this">
        <swiper-item>
          <image src="{{item}}" class="slide-image" style="width:100%" />
        </swiper-item>
      </block>
    </swiper>

  </view>