微信小程序 调用远程接口,给全局数组赋值
关键是 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.发起对服务器的请求(在这过程 ...
随机推荐
- sklearn中的KMeans算法
1.聚类算法又叫做“无监督分类”,其目的是将数据划分成有意义或有用的组(或簇).这种划分可以基于我们的业务需求或建模需求来完成,也可以单纯地帮助我们探索数据的自然结构和分布. 2.KMeans算法将一 ...
- Java实现简易聊天室
Java实现简易聊天室 在学习<Java从入门到精通>这本书,网络通信,基于TCP实现的简易聊天室,我这里对书中的代码略做了修改,做个记录. 这里先放一下运行效果图,代码放在最后. 运行效 ...
- 动态路由 RIP
不同网段之间进行通信,中间有多个路由器的情况下,我们可以通过配置RIP动态路由来实现数据转发. 实验拓扑 如图所示连接,地址规划如下: 名称 接口 IP地址 R1 f0/0 192.168.10.1/ ...
- Spring5.0.x SSM项目中Json转换器 的配置
json作为前后端交互的重要手段,在springMVC中有自带的转换器可以免去平时那些繁琐的事情: pom文件添加:spring5.0以上用Jackson2.9以上的版本 <dependency ...
- 【使用DIV+CSS重写网站首页案例】CSS引入方式
CSS引入方式(3种) *就近原则:行内引入可以覆盖内部引入的效果 内部引入: * type="text/css" 为默认可以不写 例子: <!DOCTYPE h ...
- css 布局 flex
cursor 设置鼠标放上去后的形状 visability 设置是否可见 flex 详见这篇文章https://developer.mozilla.org/zh-CN/docs/Learn/CSS/C ...
- 洛谷P3069 [USACO13JAN]牛的阵容Cow Lineup(尺取法)
思路 考虑比较朴素的解法,枚举每个长度为\(k+1\)的区间,然后统计区间中出现次数最多的颜色.这样的话复杂度为\(O(n*k)\)的,显然不行. 观察到统计每个区间中出现次数最多的颜色中,可以只用看 ...
- Linux 下 svn 多个项目多用户分配
安装步骤如下: 1.yum install subversion 2.输入rpm -ql subversion查看安装位置,如下图: 输入 svn –help可以查看svn的使用方法 需求 开发服务器 ...
- xargs的用法
处理带有空格的文件名 #我们创建了3个日志文件, 且故意让文件名称中都含有空格 [roc@roclinux ~]$ ;i<;i++)); do touch "test ${i}.log ...
- 18、Python模块基础
一.模块 模块可以看成是一堆函数的集合体. 一个py文件内部就可以放一堆函数,因此一个py文件就可以看成一个模块. 如果这个py文件的文件名为module.py,模块名则是module. 1.模块的四 ...