无法读取 vuex 中 Store._callee 处未定义的属性“getProduct”（操作名称）

Posted 2023-02-23

【中文标题】无法读取 vuex 中 Store._callee 处未定义的属性“getProduct”（操作名称）

【英文标题】：Cannot read property 'getProduct'(action name) of undefined at Store._callee in vuex

【发布时间】：2020-07-30 13:47:52

【问题描述】：

我正在开发一个 vue 项目，我使用 vuex 来管理状态。我已经定义了状态、动作、突变以及调用动作的调度。但问题是，我在调度附近遇到错误，例如无法读取 Store._callee 未定义的属性 'getProduct'(action name)。

谁能指导我哪里做错了？

这是我的代码：

组件的调度动作：

async created() 
  try 
     await this.$store.dispatch("getProduct");
   catch (error) 
     console.log("Error", error);
  

动作代码：

在 ProductService 中，我有执行 API 调用的 getProduct() 函数。

const actions = 
   async getProduct( commit ) 
      commit("GET_PRODUCT", await ProductService.getProduct());
   

变异代码：

const mutations = 
   GET_PRODUCT: (state, product) => 
      state.product = product;   // Here I am mutating the state
   

【问题讨论】：

您能否在getProduct 操作的顶部放置console.log(ProductService)，以确认它是否被调用以及是否实际定义了ProductService？

这无关，但这是错误的 commit("GET_PRODUCT", await ProductService.getProduct());提交是同步操作。你需要等待然后提交 const res = await ProductService.getProduct() commit("GET_PRODUCT", res)

嗨@skirtle，感谢您的快速回复，您所说的一切正常。

@RaduDiță，如果你能看到官方网站，有一个例子 -> 动作： async actionA ( commit ) commit('gotData', await getData()) , async actionB ( dispatch, commit ) await dispatch('actionA') // 等待actionA 完成 commit('gotOtherData', await getOtherData())

你是对的，我的错

【参考方案1】：

调试了半天，才知道是action code里面的service function'ProductService.getProduct()'有错误。在我的例子中，我创建了名为 'ProductService' 的服务文件，其中我定义了 API 调用的函数，'getProduct()' 是 API 调用的函数之一完成以获取产品列表。

当我尝试打印此函数调用是否返回值并且返回未定义并且因此出现上述错误时。然后我修复了该函数调用返回未定义的服务函数中的问题，之后它工作正常。

错误出现在下面的代码行中。

commit("GET_PRODUCT", await ProductService.getProduct());

感谢@skirtle 和@Radu Diță 的 cmets。