javascript - 还是不太懂vuex中的action用法要怎么把获取到的值用来改变state

问题描述

问 题

官方文档中说action是用来提交mutations的且可以异步。给出的示例是：

actions: {
  incrementAsync ({ commit }) {
    setTimeout(() => {
      commit('increment')
    }, 1000)
  }
}

文档里表示commit提交mutation。我看不懂的点在于他commit的用法，因为state和mutation全都是叫increment，所以猜测increment应该mutation名。但是我想通过action通过ajax获取一个值去改变state应该怎么写呢？
看来好多资料都是官网的示例，还有一个虽然不是官网的 但没看懂最开始的return dispatch
如果有大神能看懂 还希望不吝赐教

function makeAction(type) {
  return ({ dispatch }, ...args) => dispatch(type, ...args);
};

const initNote = {
  id: +new Date(),
  title: '我的笔记',
  content: '第一篇笔记内容',
  favorite: false
};

// 模拟初始化数据
const initData = {
  show: 'all',
  notes: [initNote],
  activeNote: initNote
};

export const initStore = ({ dispatch }) => {
  dispatch('INIT_STORE', initData);
};
// 更新当前activeNote对象
export const updateActiveNote = makeAction('SET_ACTIVE_NOTE');

// 添加一个note对象
export const newNote = makeAction('NEW_NOTE');

解决方案

1. commit后第一个参数就是mutation的名。
2. 改变数据用mutation，需要做一些异步操作用action,然后action内commit已定义好的mutation
3. 你贴的例子，开始就是一个创建action的函数。看不懂的地方是es6函数参数的解构赋值。

这篇关于javascript - 还是不太懂vuex中的action用法要怎么把获取到的值用来改变state的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！