从具有相同突变的另一个方法调用方法

Question

我的 nuxt 状态有以下代码块。

export const mutations = {
  logout () {
    localStorage.removeItem('userToken')
    localStorage.removeItem('expiryDate')
    localStorage.removeItem('userId')
    this.state.userId = null
    this.state.token = null
    this.state.authenticated = false
  },

  autoLogout ({dispatch},milliseconds) {
    setTimeout(() => {
      dispatch.logout()
    }, milliseconds)
  }
}

使用上面的代码，我收到 dispatch is not a function 的错误消息。如何从 autologout() 方法

中调用 logout()

Answer 1

“dispatch”语法属于 Vuex 中的 actions，而不是 mutations。要调用另一个突变，您需要为 mutations.

使用“commit”

您还需要使用字符串参数调用调度和提交函数，作为您要调用的操作或突变的名称，例如

commit('logout') 或 dispatch('fetchUserInfo')

当谈到你的主要问题时，在一个 mutation 中提交另一个 mutation 是违反 Vuex 实践的，实际上 不可能。

Vuex 突变可以接受两个参数，state 和 payload。 commit 不是其中之一。

这些类型的异步函数应该列在操作下，特别是如果您实际上要使用 API 调用或任何类型的 HTTP 请求而不是 setTimeOut 函数。在您的情况下，我会将 autoLogout 突变重写为这样的操作：

  autoLogout ({commit}, milliseconds) {
    setTimeout(() => {
      commit('logout')
    }, milliseconds)
  }

祝你好运！

从具有相同突变的另一个方法调用方法

Call method from another method with in same mutation

javascript

vue.js

vuejs2

nuxtjs