axios可以获取到数据，控制台输出'code'为undefined,如何解决这个问题?

  • Z时代
  • 2024-02-18
  • 分类：IT

问题描述:

使用axios获取数据成功了,但获取的数据没有成功进入仓库,仓库里有数组,数组内容是空的.
Vscode没报错,然后我试着重启了服务器控制台也还是报错.

相关代码:

1.报错代码:

index.js?8626:14 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'code')
    at Store.getCategoryList

2.axios请求代码:

api/index.js文件:

export const reqGetCategoryList = () => {
    requests.get('/product/getBaseCategoryList')
}

home/index.js文件:

import { reqGetCategoryList } from "@/api"
const state = {
    categoryList: []
}
const mutations = {
    CATEGORYLIST(state, categoryList) {
        state.categoryList = categoryList
    }
}
const actions = {
    async getCategoryList({ commit }) {
        let result = await reqGetCategoryList();
        if (result.code==200) {
            commit("CATEGORYLIST", result.data)
        }
    }
}
const getters = {}
export default {
    state,
    mutations,
    actions,
    getters
}

期待的结果是什么？实际看到的错误信息又是什么？

我期待的仓库内容是categoryList:Array[17]
报错后的仓库内容是categoryList:Array[0]

解决方法:

我的api/index.js文件里的"requests.get"之前没有加return,这部分是一个箭头函数,如果我有使用{},那么必须加return,因为使用 requests.get... 获取到的数据会被使用，后面如果箭头函数函数体只有一句话且我没有使用{},那么可以省略return

回答：

export const reqGetCategoryList = () => {
    return  requests.get('/product/getBaseCategoryList')
}

回答：

无法读取未定义的数据, 试试看能不能这样写, state直接使用const定义的值不要使用参数

CATEGORYLIST(_state, categoryList) {
    state.categoryList = categoryList
}

回答：

错误信息很明确：不能访问 undefined 的 code。

axios 返回的数据结构没有 code，所以你 actions 里 if (result.code===200) 就会报错。解决方案是：

  1. 你先好好把 axios 文档看了
  2. 从返回值里把 data 取出来
  3. 然后再访问它的 data.code

回答：

看起来是异步问题，没有获取到数据，因为 result等于 undefined ，而 undefined 是没有code的。

-- 方法
//App.vue - async Axios
const loadQuote = async () => {
      const response = await KanyeAPI.getQuote()
      quote.value = response.data.quote
}
-- 调用
loadQuote()

可以先再模块内测试。
如果你使用异步的话，所有调用的父级方法都需要加 async 前缀。

回答：

三楼说的对，reqGetCategoryList 方法都没有返回值，await reqGetCategoryList() 的结果自然是 undefined

以上是 axios可以获取到数据，控制台输出'code'为undefined,如何解决这个问题? 的全部内容， 来源链接： utcz.com/p/932847.html

回到顶部