当前位置:  开发笔记 > 前端 > 正文

微信小程序 调用远程接口 给全局数组赋值代码实例

这篇文章主要介绍了微信小程序调用远程接口给全局数组赋值代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

关键是 let that = this

因为在onLoad 的 wx.request方法里, this指的是 wx.request 的上下文, 所以应该是在 onLoad 的时候定义 let that = this

调用远程服务,序列化后,把obj赋值给bookList

最开始的报错代码如下:

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
    })
   }
  })
 }
})

报错为:

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

报错原因是this 指向有问题,得在onload的时保存实例指向,let that = this,下面全用that,this指向永远值得是自己的上下文环境

正确代码如下:

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
    })
   }
  })
 }
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

推荐阅读
360691894_8a5c48
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有