this.$store.dispatch() 与 this.$store.commit()方法的区别

总的来说他们只是存取方式的不同,两个方法都是传值给vuex的mutation改变state

commit: 同步操作

存储

this.$store.commit('changeValue',name)

取值

this.$store.state.changeValew

dispatch: 异步操作
存储

this.$store.dispatch('getlista',name)

取值

this.$store.getters.getlists

案例：

login.vue
this.$store
            .dispatch("Login", this.loginForm)
            .then(() => {
              this.$router.push({ path: this.redirect || "/" });//登陆成功后，重定向到首页
            })
            .catch(() => {
              this.loading = false;
              this.getCode();
            });

@store/index.js
actions: {
    // 登录
    Login({ commit }, userInfo) {
      const username = userInfo.username.trim()
      const password = userInfo.password
      const code = userInfo.code
      const uuid = userInfo.uuid
      return new Promise((resolve, reject) => {
        login(username, password, code, uuid).then(res => {
          setToken(res.token)
          commit('SET_TOKEN', res.token)
          resolve()
        }).catch(error => {
          reject(error)
        })
      })
    },
}