微信小程序——api调用(糗事百科例子)

糗事百科api分析

糗事百科
http://m2.qiushibaike.com/article/list/{type}?type=refresh&page={page}&count={count}
参数type为类型，latest最新、text文本、image图片、video视频
参数page为页码；参数count为每页数量
示例：http://m2.qiushibaike.com/article/list/text?type=refresh&page=1&count=12

wx小程序请求api方法

微信小程序开发官方文档有给出wx.request()方法用于请求外部连接。官方文档链接为
https://developers.weixin.qq.com/miniprogram/dev/api/network/request/wx.request.html
注意：请将本地设置中的“不校验合法域名、web-view(业务域名)、TLS版本以及HTTPS证书”勾上

尝试用wx.request()方法请求

onLoad: function (options) {
   
    var _this = this
    wx.request({
   
      url: 'http://m2.qiushibaike.com/article/list/text?type=refresh&page=1&count=12',
      success:function(res){
   
        console.log(res)
      }
    })
  },

打印回应数据：

我们从中找到文章的数据：

console.log(res.data.items)

结果为：

将我们要的数据用this.setData()方法存入我们定义的变量中以便页面获取使用

js代码：

页面在刚加载的时候就请求数据，所以将代码放在onLoad()方法中

Page({
   
  data: {
   
    res:{
   },
  },
  onLoad: function (options) {
   
    var _this = this
    wx.request({
   
      url: 'http://m2.qiushibaike.com/article/list/text?type=refresh&page=1&count=12',
      success:function(</