小程序request 里面循环怎么写

小程序request 里面循环怎么写.jpg" alt="小程序request 里面循环怎么写">

在小程序开发中，我们经常需要使用小程序提供的request API 来进行网络请求。但是使用API时，有些情况下需要对请求体多个参数进行循环操作。如何在request里面进行循环呢？下面将从三个方面为大家详解。

使用Promise.all方式处理循环请求

Promise.all 可以接受一个promise对象数组作为参数，并发执行里面的所有promise对象，并在全部完成后返回响应结果数组。因此我们可以在循环中定义一个promise对象数组，存放每一次的请求，并使用Promise.all()方法等待它们全部结束。

//仿照名师推荐列表的swiper视图
  const ids = [117438, 106655, 107801]
  let promiseArr = []
  for(let id of ids) {
    promiseArr.push(new Promise((resolve, reject) => {
      wx.request({
        url: 'https://www.xxxx.com',
        data:{id: `${id}`},
        success(res) {
          resolve(res.data)
        },
        fail(err) {
          reject(err)
        }
      })
    }))
  }
  Promise.all(promiseArr).then(results => {
    console.log(results)
  }, error => {
    console.error(error)
  })

同步循环操作——使用async/await

async/await内置了generator和co库的优势，在循环中只要当前请求结束后返回是个promise即可，将每一次操作封装在函数之内。为异步操作添加await关键字来等待结果。其次我们可以使用for..of循环遍历时获取forEach无法得到索引下标的特性。

async function getRequest(){
    const ids = [117438, 106655, 107801]
    for(let i=0;i

通过递归方式处理请求结果

如果我们想将当前响应作为请求数据实现递归请求怎么处理呢？一般情况下，我们需要封装一个方法作为多次调用该接口 或在 promise 中使用 reject / resolve 的回调函数传入方法。例如下列代码：

//递归函数请求列表
const request = (url) => {
  return new Promise((resolve, reject) => {
    wx.request({
      url: url,
      success: res => {
        if (res.statusCode === 200 && res.data.length > 0) {
          resolve(res.data)
        } else {
          reject(new Error(res.errMsg))
        }
      },
      fail: err => reject(err)
    })
  }).then(data => {
    console.log(data) //请求结果
    const nextUrl = data && data.next || ''
    if (nextUrl) {
      return request(nextUrl)  //递归调本身完成后续操作
    } else {
      console.log('STOP...')
    }
  }, error => console.error(error))
}
request('https://www.xxxxx.com')

结语

以上就是小程序request循环请求的几种实现方式，使用Promise.all、async/await以及递归方式，这些方法在循环请求时皆有所用。尤其是对于后端分页进行数据请求时更是大有帮助，增强了小程序API的可拓展性和灵活度。

**本文由武汉科技提供