Question

我的vuex变异如何发送新动作或我的动作如何获得对商店的读取权限？

基本上我有一个叫做变异的动作：

updateSelectedItems: (context, payload) => {
  context.commit('updateSelectedItems', payload);
},

更新列表的突变。它还可以获得任何新物品。我需要对这些新项目做点什么：

updateSelectedItems: (state, payload) => {
  var newItems = _.differenceWith(payload, state.selectedItems, function (a, b) {
    return a.name === b.name;
  });
  state.selectedItems = _.cloneDeep(payload);

  _.each(newItems, (item) => {
    // How do I do this??
    context.dispatch('getItemDetail', item.name)
  });
},

Answer 1

让你的突变做得太多真的不是最好的做法。如果它们超级简单并且通常只做一件事，那就最好了。让您的行动处理可能影响州的任何多步骤流程。

你的例子会更有意义地结构化：

actions: {
  updateSelectedItems(context, payload) {
    var selectedItems = context.state.selectedItems;
    var newItems = _.differenceWith(payload, selectedItems, (a, b) => {
      return a.name === b.name;
    });

    context.commit('setSelectedItems', payload);

    _.each(newItems, (item) => {
      context.dispatch('getItemDetail', item.name)
    });
  },
  getItemDetail(context, payload) {
    // ...
  }
},
mutations: {
  setSelectedItems(state, payload) {
    state.selectedItems = _.cloneDeep(payload);
  }
}

如果你真的需要从变异内部发送一些东西（我强烈建议不做），你可以将调度函数作为有效载荷的一部分传递给变异。

Answer 2

从技术上讲，可以使用this来呼叫dispatch或commit（或其他几个人）...我只是想为来到这里并需要他们的任何人提及这一点特定的用例。

在我的情况下，我使用的是 fiery-vuex 库，该库实际上将一个函数作为有效载荷传递，该函数将返回更新的数据，我将其与refresh_time键一起使用数据库来确定何时刷新某些用户数据

SOME_MUTATION( state, getData() ){
    const new_data = getData()
    if( new_data.refresh_time > state.user.refresh_time ){
        this.dispatch( 'refreshFromOtherStateMeta', state.user.id )
    }
    state.user = new_data
}

我的vuex变异如何发布新动作？

2 个答案: