对如何使用 axios 正确处理 javascript 承诺有些困惑

Question

所以我有两个简单的函数，第一个函数进行 api 调用并检索 100 个类别 ID 并将它们存储在一个数组中。我使用 lodash 随机选择其中的 6 个类别 ID。第二个函数假设使用这 6 个唯一的类别 ID，并在查询字符串中使用它们，以便在第二个函数中进行接下来的 6 个 api 调用。async function getCategoryIds() {    const res = await axios.get('http://jservice.io//api/categories?count=100');    for (let cat of res.data) {        categories.push(cat.id)    }    var sampleCategories = _.sampleSize(categories, 6);    console.log(sampleCategories);    return sampleCategories;}getCategoryIds()    .then(getCategory)async function getCategory(sampleCategories) {    const res1 = await axios.get(`http://jservice.io/api/category?id=${sampleCategories[0]}`);    const res2 = await axios.get(`http://jservice.io/api/category?id=${sampleCategories[1]}`);    const res3 = await axios.get(`http://jservice.io/api/category?id=${sampleCategories[2]}`);    const res4 = await axios.get(`http://jservice.io/api/category?id=${sampleCategories[3]}`);    const res5 = await axios.get(`http://jservice.io/api/category?id=${sampleCategories[4]}`);    const res6 = await axios.get(`http://jservice.io/api/category?id=${sampleCategories[5]}`);}getCategory();但是，无论我如何返工，我仍然无法消除此错误：Uncaught (in promise) TypeError: Cannot read property '0' of undefined有人可以引导我朝着正确的方向前进吗？谢谢你。

Answer 1

如果您的后端准确地发送响应一个准确的数组，那么您应该

调用 getCategory 函数时不要忘记提供参数

然后编辑您的 getCategory 函数

async function getCategory(sampleCategories) {

    let arr = []

    const res1 = await axios.get('any url you want')

    //repeat 6 times

    arr = [res1, res2, ...otherElems]

   return arr

}

使用 'then' 语法

getCategoryIds()

    .then(response => getCategory(response))

使用异步等待语法

const firstResponseArr = await getCategoryIds();

const secondResponseArr = await getCategory(firstResponseArr);

Answer 2

你的错误

调用getCategory();传递任何参数。显然async function getCategory(sampleCategories)需要一个论点 -sampleCategories你没有通过。

错误解释

Uncaught (in promise) TypeError: Cannot read property '0' of undefined # sampleCategories

getCategory()带参数调用

这与 axios 无关，而是与您的粗心错误有关。（别担心，即使是我们中最好的人也会发生这种情况）

Answer 3

好吧，所以我一直在努力弄清楚如何正确利用 async/await——这似乎对我有用：

let categories = []

var sampleCategories = []

async function getCategoryIds() {

    const res = await axios.get('http://jservice.io//api/categories?count=100');

    for (let cat of res.data) {

        categories.push(cat.id)

    }

    var sampleCategories = _.sampleSize(categories, 6);

    return sampleCategories;

}

getCategoryIds()

async function getCategory() {

    var y = await getCategoryIds();

    const res1 = await axios.get(`http://jservice.io/api/category?id=${y[0]}`);

    const res2 = await axios.get(`http://jservice.io/api/category?id=${y[1]}`);

    const res3 = await axios.get(`http://jservice.io/api/category?id=${y[2]}`);

    const res4 = await axios.get(`http://jservice.io/api/category?id=${y[3]}`);

    const res5 = await axios.get(`http://jservice.io/api/category?id=${y[4]}`);

    const res6 = await axios.get(`http://jservice.io/api/category?id=${y[5]}`);

    let arr = [res1, res2, res3, res4, res5, res6]

    return arr

}

getCategory();