微信小程序如何調用API實現數據請求-wx.request()

本文轉載自查看原文 2020-05-09 23:13 831 小程序

前言

微信小程序不存在ajax，那么它是如何實現數據請求功能的呢？在微信中提供了API的調用wx.request(OBJECT)，這個是很不錯的。下面就講一下如何請求數據，簡單到不行。

wx.request

看文檔時，提供了示例模板如下：

wx.request({
  url: 'test.php', //僅為示例，並非真實的接口地址
  data: {
     x: '' ,
     y: ''
  },
  header: {
  	'content-type': 'application/json' // 默認值
  },
  success: function(res) {
    console.log(res.data)
  }
})

如何調取數據這是個難題，但是要模擬調用是有可能的。因為有個網址：https://easy-mock.com/，提供了模擬數據的請求。那么我們先來模擬一下數據吧，到時，復制鏈接給模板中的url即可。

如圖登錄官網，登錄，接着點擊箭頭，進入下一頁面。

點擊創建接口。

更新數據，創建屬於自己的數據即可。

一可預覽效果，復制鏈接到url模板中。

接着我們打開微信小程序的開發工具，在界面中添加按鈕請求即可。

 <button type='primary' bindtap='send'>請求數據</button>

接着在js文件中添加事件。

//send
  send: function(){
    wx.request({
      url: '復制的鏈接', //僅為示例，並非真實的接口地址
      data: {
        x: '',
        y: ''
      },
      header: {
        'content-type': 'application/json' // 默認值
      },
      success: function (res) {
        console.log(res.data)
      }
    })
  }

點擊按鈕如果出現下面的錯誤，那是因為要到詳情按鈕中，給個地方打個勾即可。

找到下方打鈎即可。

點擊按鈕，即可查看，請求數據效果出現了。

結語

你完成了嗎？是不是，很容易呢？是不是很簡單呢？

前言