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


Posted in Javascript onAugust 13, 2019

关键是 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
    })
   }
  })
 }
})

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

Javascript 相关文章推荐
jQuery validate 中文API 附validate.js中文api手册
Jul 31 Javascript
Javascript模块化编程(一)模块的写法最佳实践
Jan 17 Javascript
javascript获取url上某个参数的方法
Nov 08 Javascript
javascript/jquery获取地址栏url参数的方法
Mar 05 Javascript
JS父页面与子页面相互传值方法
Mar 05 Javascript
JavaScript Promise 用法
Jun 14 Javascript
JS实现快速的导航下拉菜单动画效果附源码下载
Nov 01 Javascript
jQuery源码解读之extend()与工具方法、实例方法详解
Mar 30 jQuery
JavaScript实现时间表动态效果
Jul 15 Javascript
mpvue跳转页面及注意事项
Aug 03 Javascript
vue实现移动端项目多行文本溢出省略
Jul 29 Javascript
js观察者模式的弹幕案例
Nov 23 Javascript
vue源码nextTick使用及原理解析
Aug 13 #Javascript
封装微信小程序http拦截器过程解析
Aug 13 #Javascript
Vue中通过Vue.extend动态创建实例的方法
Aug 13 #Javascript
微信小程序封装分享与分销功能过程解析
Aug 13 #Javascript
node删除、复制文件或文件夹示例代码
Aug 13 #Javascript
vue实现下拉加载其实没那么复杂
Aug 13 #Javascript
vue中created和mounted的区别浅析
Aug 13 #Javascript
You might like
php中time()和mktime()方法的区别
2013/09/28 PHP
CI框架常用经典操作类总结(路由,伪静态,分页,session,验证码等)
2016/11/21 PHP
laravel migrate初学常见错误的解决方法
2017/10/11 PHP
php+redis实现消息队列功能示例
2019/09/19 PHP
使用jquery组件qrcode生成二维码及应用指南
2015/02/22 Javascript
如何用js 实现依赖注入的思想,后端框架思想搬到前端来
2015/08/03 Javascript
jQuery实现大转盘抽奖活动仿QQ音乐代码分享
2015/08/21 Javascript
Node.js刷新session过期时间的实现方法推荐
2016/05/18 Javascript
jquery实现全选、不选、反选的两种方法
2016/09/06 Javascript
jQuery旋转插件jqueryrotate用法详解
2016/10/13 Javascript
jQuery遍历节点方法汇总(推荐)
2017/05/13 jQuery
Ionic2开发环境搭建教程
2020/08/20 Javascript
浅谈通过JS拦截 pushState和replaceState事件
2017/07/21 Javascript
javascript中UMD规范的代码推演
2018/08/29 Javascript
使用vuex存储用户信息到localStorage的实例
2019/11/11 Javascript
微信小程序点击按钮动态切换input的disabled禁用/启用状态功能
2020/03/07 Javascript
python分析nignx访问日志脚本分享
2015/02/26 Python
python找出完数的方法
2018/11/12 Python
python 实现调用子文件下的模块方法
2018/12/07 Python
Python列表与元组的异同详解
2019/07/02 Python
Python3的高阶函数map,reduce,filter的示例详解
2019/07/23 Python
python实现excel公式格式化的示例代码
2020/12/23 Python
英国安全产品购物网站:The Safe Shop
2017/03/20 全球购物
美国环保婴儿用品公司:The Honest Company
2017/11/23 全球购物
爱尔兰灯和灯具网上商店:Lights.ie
2018/03/26 全球购物
行政管理专业推荐信
2013/11/02 职场文书
创业计划书中包含的9个方面
2013/12/26 职场文书
2014年有孩子的离婚协议书范本
2014/10/08 职场文书
装配车间主任岗位职责
2015/04/08 职场文书
2015年社区居委会工作总结
2015/05/18 职场文书
六五普法先进个人主要事迹材料
2015/11/03 职场文书
导游词之海南-南湾猴岛
2019/10/12 职场文书
nginx网站服务如何配置防盗链(推荐)
2021/03/31 Servers
解决pycharm安装scrapy DLL load failed:找不到指定的程序的问题
2021/06/08 Python
InterProcessMutex实现zookeeper分布式锁原理
2022/03/21 Java/Android
Win11显卡控制面板打开显卡设置方法
2022/04/20 数码科技