微信小程序 wx.request
onLoad: function () {
var that = this
console.log('https://free-api.heweather.com/s6/weather?location=' + curCity + '&key=fd29112697d54606bd9499e54b05cf1d',)
wx.request({
url: 'https://free-api.heweather.com/s6/weather?location='+curCity+'&key=fd29112697d54606bd9499e54b05cf1d',
headers: {
'Content-Type': 'application/json'
},
success: function (res) {
that.setData({
now_weather: res.data.HeWeather6[0].now.tmp,
now_cond: res.data.HeWeather6[0].now.cond_txt,
high_tmp: res.data.HeWeather6[0].daily_forecast[0].tmp_max,
low_tmp: res.data.HeWeather6[0].daily_forecast[0].tmp_min,
for_array: res.data.HeWeather6[0].daily_forecast,
result: 1,
jsonData: JSON.stringify(res.data.HeWeather6[0].daily_forecast)
})}
},
)},
这是微信小程序中最经常使用的request请求,一般都是直接在success中设置相关前台参数。如果想要用从接口中获取的数据和本地数据拼凑成数组或者前台对象等,那么就需要等到通过网络通信获得json后解析并拼凑
但是,由于request请求和其他function是异步的,即request还未执行完就会执行其他function,导致数据在渲染的时候无法获取到正确的,所以针对这个问题,有一个看起来很笨的办法:
onLoad: function () {
curCity = app.globalData.selectedCity
var that = this
setImage()
console.log(curCity)
var times = setInterval(function () {
if (result) {
console.log(jsonData)
for (var i = 0; i < 8; i++) {
var object1 = new Object();
var json = JSON.parse(jsonData);
// console.log(json)
object1.index = json[i].type
object1.brf = json[i].brf
object1.txt = json[i].txt
object1.img = list2[i]
list[i] = object1
//console.log(i)
//console.log(list[i])
console.log(list[i].img)
}
var json2 = JSON.parse(sunJson);
console.log(json2)
forsr = json2.sr
forss = json2.ss
console.log(json2)
clearTimeout(times);//清除计数器
}
that.setData({
for_array: list,
for_sr:forsr,
for_ss:forss
})
},
)
},
})
function setImage() {
var that = this
wx.request({
url: 'https://free-api.heweather.com/s6/weather?location='+curCity+'&key=fd29112697d54606bd9499e54b05cf1d',
headers: {
'Content-Type': 'application/json'
},
success: function (res) {
console.log(curCity)
/*that.setData({
now_weather: res.data.HeWeather6[0].now.tmp,
now_cond: res.data.HeWeather6[0].now.cond_txt,
high_tmp: res.data.HeWeather6[0].daily_forecast[0].tmp_max,
low_tmp: res.data.HeWeather6[0].daily_forecast[0].tmp_min,
for_array: res.data.HeWeather6[0].daily_forecast,
result: 1,
jsonData: JSON.stringify(res.data.HeWeather6[0].daily_forecast)
})*/
result = 1
jsonData = JSON.stringify(res.data.HeWeather6[0].lifestyle)
sunJson = JSON.stringify(res.data.HeWeather6[0].daily_forecast[0])
//console.log(jsonData)
//setImage()
}
})
}
在setimage方法中,进行网络连接,如何已经获取到了正确的数据,就把标志位result记为1;同时,在onload函数中,写一个记数循环,当检查到result为1时即证明数据已经获得,然后进行下一步操作。记数要记得及时清空,不然容易变成死循环
微信小程序 wx.request的更多相关文章
- 微信小程序wx.request接口
微信小程序wx.request接口 wx.request是小程序客户端与服务器端交互的接口 HTTPS 请求 一个微信小程序,只能同时(同时不能大于5个)有5个网络请求 wx.request(OBJE ...
- 监控微信小程序wx.request请求失败
在微信小程序里,与后台服务器交互的主要接口函数是wx.request(),用于发起 HTTPS 网络请求.其重要性不言而喻.然而,却经常遇到请求失败的问题,笔者特意谷歌"wx.request ...
- 微信小程序wx.request请求用POST后台得不到传递数据
微信小程序的wx.request请求,method设为POST并向后台传递数据,但从后台返回的信息来看后台并没有获得传递的数据 wx.request({ url: 'url' ...
- 坑:微信小程序wx.request和wx.uploadFile中传参数的区别
微信小程序中通过组件<form>提交表单的时候,在js中通过e.detail.value得到所提交表单的json格式数据.一般提交表单我们都是通过wx.request请求,提交表单数据,通 ...
- 微信小程序wx.request请求服务器json数据并渲染到页面
[原文出自]: https://blog.csdn.net/weixin_39927850/article/details/79766259 微信小程序的数据总不能写死吧,肯定是要结合数据库来做数据更 ...
- 微信小程序- wx.request请求不到数据
小程序官方文档手册 https://mp.weixin.qq.com/debug/wxadoc/dev/ 小程序开发问答社区 http://www.henkuai.com/forum.php wx.r ...
- 微信小程序wx.request的简单封装
前言 之前写小程序,每次请求后台时都直接调用原生的API,wx.request,每次都要写url,data,回调函数等,正好前段时间,小程序项目需要添加新内容,趁此机会,做一个封装的请求工具,比较简单 ...
- 微信小程序wx.request POST获取不到数据解决办法
get //发起请求 wx.request({ url: 'http://www.xiaochengxu.com/home/index/curd', //仅为示例,并非真实的接口地 ...
- 微信小程序 wx.request POST请求------中文乱码问题
问题: 一个简单的表单,提交后台返回数据“提交成功”. 以为没问题了,但是没过多久后台小哥就问为啥那么多乱码,找了很久原因,发现在提交的时候就已经乱码了. 嗯,前端问题,然后测试GET/POST方法. ...
随机推荐
- FileFilter过滤器
FileFilter过滤器原理: File对象的listFiles()方法做了三件事情: 第一件,遍历得到所有的文件/文件夹: 第二件,调用入参过滤器接口自己DIY的实现类中重写的accept()方法 ...
- 2018-2019-2 《网络对抗技术》 Exp1 PC平台逆向破解 20165215
2018-2019-2 <网络对抗技术> Exp1 PC平台逆向破解 20165215 目录 知识点描述 实验步骤 (一)直接修改程序机器指令,改变程序执行流程 (二)通过构造输入参数,造 ...
- [ABP] ASP.NET Zero 5.6.0 之 ASP.NET Zero Power Tools 破解日志
两个要破解Patch的关键dll名称:AspNetZeroRadToolVisualStudioExtension.dll和AspNetZeroRadTool.dll AspNetZeroRadToo ...
- nginx + keepalived 主从模式
转自:https://www.cnblogs.com/kevingrace/p/6138185.html 负载均衡技术对于一个网站尤其是大型网站的web服务器集群来说是至关重要的!做好负载均衡架构,可 ...
- 什么是HTML DOM对象
HTML DOM 对象 HTML DOM Document 对象 Document 对象 每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 ...
- Java基础面试题总结
目录 索引 Java基础知识篇 Java web基础知识总结 Java集合篇常见问题 Java基础知识篇 面向对象和面向过程的区别 面向过程: 优点:性能比面向对象高,因为类调用时需要实例化,开销比较 ...
- 国际空间站直播 ISS直播
b站:https://live.bilibili.com/9196015 斗鱼:https://www.douyu.com/543816 欢迎大家 (ฅ´ω`ฅ)
- net应用程序池自动关闭的解决方法
while (true) { using (ServerManager sm = ServerManager.OpenRemote("localhost")) { string p ...
- Pycharm在运行过程中,查看每个变量的方法(show variables)跟终端一样显示变量
点击运行栏的这个灰色向下剪头: 在出现的窗口上,勾选上: 点击OK,重启Pycharm:接着点击Run窗口: 将Run的show variables图标勾选: 然后你就会发现,在右边出现了变量的窗口:
- 【android】安卓手机连接电脑了,但是adb devices找不到设备及找到设备但无权限的问题
安卓手机连接电脑的时候,会遇到adb连接失败,adb devices为空,或者连接成功,但是显示unauthorized的情况.遇到这种情况,一般认为是手机驱动安装失败,会选择重新下载安装驱动,如果还 ...