如何在 vuex 动作中制作循环，axios 循环答案

【问题标题】：How to make loop in vuex action, axios loop如何在 vuex 动作中制作循环，axios 循环
【发布时间】：2020-09-21 11:57:37
【问题描述】：

需要帮助，我有这个按类别 id 获取产品列表的 vuex 操作：

async GET_PRODUCTS({commit}, {cat}) {
    let products = []
    for (let i = 0; i < 2; i++) {
        let arr = await axios.get(
          `https://example.com/api/get-items.php`, {
            params: {
              cat,
              token: "0e94e09856a22496613b325473b7de8cb0a",
              p: i
            }
          }
        )
      console.log(arr);
      commit('SET_PRODUCTS', products.push(arr.data))
    }
    console.log(products);
    return products
  },

api 只给出 100 个产品，我需要传递一个参数：p=0 它的前 100 个产品，p=1 下一个 100，p=2 下一个 100，等等，当 api 在数组中返回少于 100 个产品时，我如何停止循环？更新：现在我有数组数组，需要将它们连接到 1

【问题讨论】：

标签： vue.js axios vuex nuxt.js

【解决方案1】：

不要将新的子数组推送到主数组，只需将它们连接起来。然后在收到的商品少于 100 件时打破循环：

async GET_PRODUCTS({commit}, {cat}) {
    let products = []
    for (let i = 0; true; i++) { // <--- loop forever
        let arr = await axios.get(
          `https://example.com/api/get-items.php`, {
            params: {
              cat,
              token: "0e94e09856a22496613b325473b7de8cb0a",
              p: i
            }
          }
        )
      products = products.concat(arr.data) // <--- concatenate new array to the old one
      commit('SET_PRODUCTS', products)
      if (arr.data.length < 100) break // <--- exit the cycle
    }
    console.log(products);
    return products
  },

【讨论】：