对如何使用 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 # sampleCategoriesgetCategory()带参数调用这与 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();