Vuex中的dispatch用来触发(派发)action

发布时间:2024年01月16日

Vuex 中的 dispatch 方法是用来触发(派发)action 的。store.dispatch(‘actionName’) 会去调用名为 actionName 的 action。

在 Vuex 中,actions 类似于 mutations,但是可以包含任意异步操作,而且 action 不能直接修改 state,必须通过提交(commit)mutation 来修改 state

如果我们调用 store.dispatch(‘resetChatInput’),那么就是触发执行名为 ‘resetChatInput’ 的 action。具体执行什么操作取决于 ‘resetChatInput’ 对应的 action 函数在 Vuex store 中的定义。
例如,如果你的 Vuex store 定义如下:

export default createStore({
  state: {
    input: {
      prompt: '',
      quoteChatId: '',
      refImage: ''
    }
  },
  mutations: {
    RESET_CHAT_INPUT(state) {
      state.input.prompt = ''
      state.input.quoteChatId = ''
      state.input.refImage = ''
    }
  },
  actions: {
    resetChatInput({ commit }) {
      commit('RESET_CHAT_INPUT')
    }
  }
})

那么,store.dispatch(‘resetChatInput’) 就是触发 ‘resetChatInput’ 这个 action,这个 action 会执行一个异步操作(在这个例子中没有异步操作),然后提交 mutation ‘RESET_CHAT_INPUT’,这个 mutation 会重置 prompt、quoteChatId 和 refImage 这三个 state 的值为默认值。

文章来源:https://blog.csdn.net/weixin_57541715/article/details/135621693
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。