微信小程序 调用远程接口,给全局数组赋值
关键是 let that = this
因为在onLoad 的 wx.request方法里, this指的是 wx.request 的上下文, 所以应该是在 onLoad 的时候定义 let that = this
调用远程服务,序列化后,把obj赋值给bookList
正确代码如下:
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
})
}
})
}
})
最开始的报错代码如下:
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指向永远值得是自己的上下文环境
原创文章,欢迎转载,转载请注明出处!
微信小程序 调用远程接口,给全局数组赋值的更多相关文章
- java微信小程序调用支付接口(转)
简介:微信小程序支付这里的坑还是有的,所以提醒各位在编写的一定要注意!!! 1.首先呢,你需要准备openid,appid,还有申请微信支付后要设置一个32位的密钥,需要先生成一个sign,得到pre ...
- java微信小程序调用支付接口
简介:微信小程序支付这里的坑还是有的,所以提醒各位在编写的一定要注意!!! 1.首先呢,你需要准备openid,appid,还有申请微信支付后要设置一个32位的密钥,需要先生成一个sign,得到pre ...
- 微信小程序调用api接口
请求的第三方微信url大概有3种 1)$url = "https://api.weixin.qq.com/sns/oauth2/access_token?appid=$appid&s ...
- 微信小程序调用后台接口+热点新闻滚动展示
1.微信JS文件,发送请求调用: //将返回接口数据,写入Page({data})里面 //获取热点新闻,这个也是写在onload:function(){//code)里面的 wx.request( ...
- 微信小程序通过api接口将json数据展现到小程序示例
这篇文章主要介绍了微信小程序通过api接口将json数据展现到小程序示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧实现知乎客户端的一个重要知识前提就是,要知道怎么通过 ...
- 图解微信小程序---调用API操作步骤
图解微信小程序---调用API操作步骤 什么是API API(Application Programming Interface,应用程序编程接口:是一些预先定义的函数,目的是提供应用程序与开发人员基 ...
- 微信小程序request(ajax)接口请求封装
微信小程序request(ajax)接口请求封装 最近在进行小程序的编写,需要调用后端接口,经常要用到wx.request方法,所以就自己封装了一下,简化一下代码,如果能给大家提供帮助更好,在封装的时 ...
- 微信小程序wx.request接口
微信小程序wx.request接口 wx.request是小程序客户端与服务器端交互的接口 HTTPS 请求 一个微信小程序,只能同时(同时不能大于5个)有5个网络请求 wx.request(OBJE ...
- 鸿蒙的远程交互组件应用及微信小程序的远程交互组件应用
注:鸿蒙的远程交互组件应用相对复杂 ,访问网络时,首先要配置网络权限,华为官方文档有问题,在此引用我老师配置的模板,见附件 过程:1.导入鸿蒙的网络请求模块fetch 2.发起对服务器的请求(在这过程 ...
随机推荐
- WebApplicationContext初始化的两种方式和获取的三种方式
原博客地址:http://blog.csdn.net/lmb55/article/details/50510547 接下来以ContextLoaderListener为例,分析它到底做了什么? app ...
- linux-Windows文件上传Linux
使用Xshell5工具: 1.使用cmd在Windows上压缩文件 2.在Xshell5上使用SSH协议与Linux服务器建立连接 3.新建文件传输 4.切换到Linux文件目录 5.使用put命令进 ...
- SQL 乐色干货笔记
因为公司基本都是用存储过程所以本来写的干货基本都是存储过程的. SELECT TOP 1 Code,Invitation,Num,Typ FROM SignLog WITH(NOLOCK) WHERE ...
- FFMPEG 命令行工具- ffmpeg
ffmpeg 简介 ffmpeg 用于转码的应用程序,命令格式: ffmpeg [options] [[infile options] -i infile]... {[outfile options] ...
- 【VNCserver】Centos7.4安装VNC连接华为云或亚马逊云
1.1 文档背景 CentOS 7 / RHEL 7部署图形化界面 安装VNCserver实现linux系统云主机桌面化,通过普通用户实现桌面化操作 2. Vncserver服务端部署 2.1 安装 ...
- Pytorch autograd,backward详解
平常都是无脑使用backward,每次看到别人的代码里使用诸如autograd.grad这种方法的时候就有点抵触,今天花了点时间了解了一下原理,写下笔记以供以后参考.以下笔记基于Pytorch1.0 ...
- wordpress获取当前页面链接
我们知道wordpress的<?php the_permalink(); ?>和<?php echo get_permalink(); ?>可以获取页面链接,但是有些比较复杂的 ...
- template_DefaultType
#include <iostream> using namespace std; template <typename T1,typename T2=int> class Te ...
- springBoot 利用Idea打包部署
springBoot 打包部署 1 项目如图: 2 依赖打包插件 3 打包操作 4 运行项目:
- Windows GUI自动化测试技术的比较和展望
https://www.cnblogs.com/yufun/archive/2009/10/10/1580132.html [这里的自动化测试专指GUI自动化(不包含Web)] 以前写过一篇跟UI自动 ...