怎么用vue读取远程新闻API接口获取到数据？

用vue读取远程新闻API接口获取到数据

准备工作

1.你需要到阿里云注册
阿里云地址
2.注册完去这个新闻接口，购买1元1000条，也可实名后可享受免费100条，要不断调试的话100条很明显不够哦。
新闻接口地址

从这里查看购买的订单

购买后记得保存一下需要的信息
请求码

新闻列表 请求地址及配置信息

新闻频道 请求地址及配置信息

开始获取接口和数据

创建专门文件夹来进行配置和接口对接

config里直接将请求码拿过来就行

这里还要下载一个外部包 axios

下载完在newsServices导入该包
导入config的请求码
配置新闻频道
get请求 该频道的请求地址 每次请求传入验证的请求码 返回最终想得到的频道数组
配置新闻列表
基本同上，另外需要配置表里需要的一些配置，详情可参考上表

Vue组件导入执行的接口函数

获取新闻频道
等待获取成功后再进行操作 得到改数组
然后就可以读取自己想要的数据了

获取新闻列表
我这里是通过父组件传递获取的
在父组件导入请求函数 执行获取
this.news = resp.contentlist; 最终数组是该id对应下的数组中的新闻数组 不清楚的可以打印获取的数组查看结构就能明白了，实际是个数组嵌套哦

这样就能在页面上获取到接口的数据了

切换标题

当然其中操作还得自己对数据进行合理处理才能达到这样的效果。
希望对大家有帮助！
点个赞吧，米娜。