9

Rails API を使用して非常に小さな Vue アプリを構築しようとしています。そのため、現在は Vue、Vue-Resource、および Vuex を使用しています。データベースからすべてのユーザーを取得し、そのうちの 1 人を更新しようとしています。したがって、すべて正常に動作します (ユーザーにパッチを適用) が、updateUser アクションを実行した後、fetchUsers アクションを再度実行して Vuex ストアを更新したいと考えています。

しかし、fetchUsers が updateUser promise 内で実行されると、次のエラーが発生します。

undefined:1 Uncaught (in promise) TypeError: Cannot read property 'dispatch' of undefined

これは私のvuex/actions.jsが見ているものです:

export const fetchUsers = function ({ dispatch, state }) {
  this.$http.get('http://localhost:3000/api/v1/users').then((response) => {
    dispatch('SET_USERS', response.data)
  }, (response) => {
    dispatch('SET_USERS', [])
    console.log(response)
  })
}

export const updateUser = function ({ dispatch, state }, user) {
  this.$http.patch('http://localhost:3000/api/v1/users/' + user.id, {user: user}).then((response) => {
    fetchUsers()
  }, (response) => {
    console.log(response)
  })
}

fetchUsers アクションがどういうわけかコンテキスト (?) を失うようになりましたが、それを処理する方法がわかりません! いつも助けてくれてありがとう！

4

2 に答える 2

12

これが私がそれを機能させる方法です:)

import Vue from 'vue'

export const fetchUsers = ({ dispatch, state }) => {
  Vue.http.get('http://localhost:3000/api/v1/users').then((response) => {
    dispatch('SET_USERS', response.data)
  }, (response) => {
    dispatch('SET_USERS', [])
    console.log(response)
  })
}

export const updateUser = ({ dispatch, state }, user) => {
  Vue.http.patch('http://localhost:3000/api/v1/users/' + user.id, {user: user}).then((response) => {
    fetchUsers({dispatch})
  }, (response) => {
    dispatch('SET_USERS', [])
    console.log(response)
  })
}
于 2016-08-27T18:52:45.717 に答える