[vuex] 비동기적 action 다루기

아래는 전형적인 vuex의 action 작성법이다.

actions: {
  increment ({ commit }) {
    commit('increment')
  }
}
store.dispatch('increment')

action은 비동기적으로 작동하기 때문에 action이 끝난 이후 어떤 동작을 정의하고 싶다면 promise를 리턴하도록 코드를 짜면 된다.

actions: {
  actionA ({ commit }) {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        commit('someMutation')
        resolve()
      }, 1000)
    })
  }
}
store.dispatch('actionA').then(() => {
  // ...
})

좋은 웹페이지 즐겨찾기