快捷導(dǎo)航

微信小程序調(diào)用遠(yuǎn)程接口給全局?jǐn)?shù)組賦值代碼實(shí)例

更新時(shí)間：2019年08月13日 17:09:38 作者：賈樹丙

這篇文章主要介紹了微信小程序調(diào)用遠(yuǎn)程接口給全局?jǐn)?shù)組賦值代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下

關(guān)鍵是 let that = this

因?yàn)樵趏nLoad 的 wx.request方法里， this指的是 wx.request 的上下文，所以應(yīng)該是在 onLoad 的時(shí)候定義 let that = this

調(diào)用遠(yuǎn)程服務(wù)，序列化后，把obj賦值給bookList

最開始的報(bào)錯(cuò)代碼如下：

Page({
 data: {
  bookList: []
 },
 onLoad: function() {
  wx.request({
   url: 'https://jiashubing.cn/wechat/book',
   header: {
    'content-type': 'application/json'
   },
   success(res) {
    var obj = JSON.parse(res.data)
    console.log(obj)
    this.setData({
     bookList: obj
    })
   }
  })
 }
})

報(bào)錯(cuò)為：

VM3293:1 thirdScriptError
Cannot read property 'setData' of null;at pages/index/index onLoad function;at api request success callback function
TypeError: Cannot read property 'setData' of null

報(bào)錯(cuò)原因是this 指向有問題，得在onload的時(shí)保存實(shí)例指向，let that ＝ this，下面全用that，this指向永遠(yuǎn)值得是自己的上下文環(huán)境

正確代碼如下：

Page({
 data: {
  bookList: []
 },
 onLoad: function() {
  let that = this
  wx.request({
   url: 'https://jiashubing.cn/wechat/book',
   header: {
    'content-type': 'application/json'
   },
   success(res) {
    var obj = JSON.parse(res.data)
    console.log(obj)
    that.setData({
     bookList: obj
    })
   }
  })
 }
})

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Javascript?Object對(duì)象類型使用詳解
面向?qū)ο缶幊?Object?Oriented?Programming)將現(xiàn)實(shí)世界中的復(fù)雜關(guān)系抽象成一個(gè)個(gè)對(duì)象,通過對(duì)象之間的分工合作對(duì)現(xiàn)實(shí)世界進(jìn)行模擬，這篇文章主要介紹了Javascript?Object對(duì)象類型使用詳解
2022-10-10
JavaScript設(shè)計(jì)模式--簡(jiǎn)單工廠模式定義與應(yīng)用案例詳解
這篇文章主要介紹了JavaScript設(shè)計(jì)模式--簡(jiǎn)單工廠模式定義與應(yīng)用,結(jié)合具體案例形式詳細(xì)分析了JavaScript設(shè)計(jì)模式中簡(jiǎn)單工廠模式基本概念、定義、用法與相關(guān)注意事項(xiàng),需要的朋友可以參考下
2020-05-05
JavaScript的數(shù)據(jù)類型轉(zhuǎn)換原則(干貨)
JavaScript是一門弱類型（或稱動(dòng)態(tài)類型）的語言，即變量的類型是不確定的。下面通過本文給大家分享javascript數(shù)據(jù)類型轉(zhuǎn)換小結(jié)，包括顯示轉(zhuǎn)換的數(shù)據(jù)類型和隱式的數(shù)據(jù)類型轉(zhuǎn)換，感興趣的朋友跟隨腳本一起看看吧
2018-03-03
javascript實(shí)現(xiàn)移動(dòng)的模態(tài)框效果
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)移動(dòng)的模態(tài)框效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-09-09
webpack.DefinePlugin與cross-env區(qū)別詳解
這篇文章主要介紹了webpack.DefinePlugin與cross-env區(qū)別詳解，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2020-02-02
js 剪切板應(yīng)用clipboardData詳細(xì)解析
本篇文章主要介紹了js剪切板應(yīng)用clipboardData。需要的朋友可以過來參考下，希望對(duì)大家有所幫助
2013-12-12
JS實(shí)現(xiàn)漂亮的窗口拖拽效果(可改變大小、最大化、最小化、關(guān)閉)
這篇文章主要介紹了JS實(shí)現(xiàn)漂亮的窗口拖拽效果,具有可改變大小、最大化、最小化、關(guān)閉等功能,以完整實(shí)例形式較為詳細(xì)的分析了JavaScript操作窗口的大小改變、還原及關(guān)閉等功能的相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2015-10-10
LayUi中接口傳數(shù)據(jù)成功,表格不顯示數(shù)據(jù)的解決方法
今天小編就為大家分享一篇LayUi中接口傳數(shù)據(jù)成功,表格不顯示數(shù)據(jù)的解決方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-08-08
setTimeout 不斷吐食CPU的問題分析
有時(shí)候我們?cè)谑褂胹etTimeout的時(shí)候會(huì)導(dǎo)致IE特別占用cpu，有可能會(huì)導(dǎo)致死機(jī)等情況。
2009-04-04
微信小程序?qū)崿F(xiàn)下拉刷新動(dòng)畫
這篇文章主要為大家詳細(xì)介紹了微信小程序動(dòng)畫實(shí)現(xiàn)下拉刷新動(dòng)畫，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-06-06