微信小程序疫情信息板块（一）

因为我想开发一个关于疫情的小程序，需要有个界面，显示国内最新的疫情信息

参考了这篇博客：

疫情信息查询微信小程序的实现_一个帅气的人。。的博客-CSDN博客

但是博主没有贴出国内板块的代码，关于疫情信息的接口，一开始也没什么头绪

原始代码如下

onLoad(options) {var that=this;wx.request({url: 'https://api.inews.qq.com/newsqa/v1/automation/modules/list?modules=FAutoCountryConfirmAdd,WomWorld,WomAboard',success(res){that.setData({list:res.data.data.WomAboard,nowConfirm:res.data.data.WomWorld.nowConfirm,confirm:res.data.data.WomWorld.confirm,heal:res.data.data.WomWorld.heal,dead:res.data.data.WomWorld.dead})}})},

加了句控制台输出看看获取到的数据（res.data.data）

点开WomWorld——[0...99]

再看页面显示wxml的语句


<scroll-view class="middle4" scroll-y="{{true}}"><view class="middle5" wx:for="{{list}}"><view class="middle6"><text>{{item.name}}</text></view><view class="middle6"><text decode="{{true}}">{{item.confirm}}&ensp;</text></view><view class="middle6"><text decode="{{true}}">{{item.confirmAdd}}&ensp;</text></view><view class="middle6"><text>{{item.heal}}</text></view><view class="middle6"><text>{{item.dead}}</text></view></view></scroll-view>

对比一下就明白是如何获取数据了

那么我们只要将接口url的api换成国内的就行

新型冠状病毒全国疫情Api接口_幕尘枫的博客-CSDN博客

这篇博客里的有列出一部分接口，我一开始选择了腾讯的

如此繁杂的数据，肉眼看肯定是愚蠢的，再小程序的控制台里查看

竟然还是这么离谱的复杂，果断换api，换成163（网易的应该是）：https://c.m.163.com/ug/api/wuhan/app/data/list-total

再次输出

果然正常了，但是发现结构好像有些许的不同，经过简单的阅读可以找到中国所在的数组，甚至贴心的把国内每天的数据单独列了出来：

中国：areaTree[2]

可以看到下面的分支today数组里的是当日，total数组里的是总计

chinaDayList里是近60天的数据，最新的在下面也就是第59个（数组0开头）

既然数据都找到了，下面就是一一对应的修改，我直接贴代码了

inde.js

onLoad(options) {var that=this;wx.request({url: 'https://c.m.163.com/ug/api/wuhan/app/data/list-total',success(res){that.setData({list:res.data.data.areaTree[2].children,nowConfirm:res.data.data.chinaDayList[59].today.confirm,confirm:res.data.data.chinaDayList[59].total.confirm,heal:res.data.data.chinaDayList[59].total.heal,dead:res.data.data.chinaDayList[59].total.dead})console.log(res.data.data)}})},

inde.wxml

<scroll-view class="middle4" scroll-y="{{true}}"><view class="middle5" wx:for="{{list}}"><view class="middle6"><text>{{item.name}}</text></view><view class="middle6"><text decode="{{true}}">{{item.total.confirm}}&ensp;</text></view><view class="middle6"><text decode="{{true}}">{{item.today.confirm}}&ensp;</text></view><view class="middle6"><text>{{item.total.heal}}</text></view><view class="middle6"><text>{{item.total.dead}}</text></view></view></scroll-view>

成功显示出来