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

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 的值为默认值。

相关推荐

  1. Vuexdispatch触发action

    2024-01-16 14:18:02       40 阅读
  2. vuexactions如何调用当前其他actions方法

    2024-01-16 14:18:02       12 阅读
  3. vue触发原生form提交到指定action地址

    2024-01-16 14:18:02       12 阅读
  4. Kotlin协程调度器Dispatchers介绍

    2024-01-16 14:18:02       11 阅读
  5. vueaction与mutation 区别

    2024-01-16 14:18:02       9 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-01-16 14:18:02       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-01-16 14:18:02       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-01-16 14:18:02       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-01-16 14:18:02       20 阅读

热门阅读

  1. 2、python函数和获取帮助

    2024-01-16 14:18:02       38 阅读
  2. python之except关键字

    2024-01-16 14:18:02       38 阅读
  3. c# 文本加密解密

    2024-01-16 14:18:02       41 阅读
  4. Redis面试题16

    2024-01-16 14:18:02       29 阅读
  5. 行为型设计模式—状态模式

    2024-01-16 14:18:02       34 阅读
  6. 分辨率的定义

    2024-01-16 14:18:02       36 阅读
  7. JUC-线程中断机制和LockSupport

    2024-01-16 14:18:02       36 阅读