微信小程序數據的接收詳解

                                  小程序數據接收的詳細流程


1.wxml:

<view class='inputbox'>

   日期<text class="tips2" wx:for="{{date}}">{{item.customer_date}}</text> 

   </view>

customer_date  爲我們需要接收的數據的字段名

wx:for="{{date}}" 中的date 是我給需要接收的數據取的數組名字,接收的數據可以爲多個

2.wxss:

.inputbox{

    background: #FFFFFF;

    height:65rpx;

    font-size:35rpx;

    line-height:65rpx;

  }

3.js

var endDate=" "; //這裏設置endDate爲空,

Page({

  data:{},

  /**

   * 生命週期函數--監聽頁面加載

   */

  onLoad: function (options) {

    this.getdata();   //調用getdata 函數

  },

 

getdata: function () {    //定義getdata 函數

    var that = this;   // 這個地方非常重要,重置data{}裏數據時候setData方法的this應爲以及函數的this, 如果在下方的sucess直接寫this就變成了wx.request()的this了

    wx.request({

      url: 'http://localhost/api/booking/getdata',//請求地址 這個根據實際情況寫

      data: {  //發送給後臺的數據

      },

      header: {//請求頭

        "Content-Type": "application/x-www-form-urlencoded"

      },

      method: "GET",

      success: function (res) {    // 請求成功

        console.log(res.data);//res.data相當於ajax裏面的data,爲後臺返回的數據

        that.setData({//如果在sucess直接寫this就變成了wx.request()的this了.必須爲getdata函數的this,不然無法重置調用函數

          date: res.data.data  //

        })

      },

      fail: function (err) { console.log(err.data); },//請求失敗

      complete: function () { }//請求完成後執行的函數

    })

  },

 

 

})

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章