web-dev-qa-db-fra.com

Valeur de retour de la mutation vuex? (id pour un objet nouvellement créé)

J'essaie de créer un objet dans une partie du magasin vuex, puis de lui passer id à un autre objet, et je ne sais pas comment le faire correctement car les mutations ne peuvent pas retourner renvoyer quoi que ce soit (dans ce cas, id ).

Deux objets de magasin ressemblent à ceci:

// store/report.js
const state = {
    name: 'Untitled Report',
    subReportIds: []
};

// store/subReport.js
const state = { ... }

Et je voudrais que cette action crée un rapport vierge, puis un sous-rapport vide, puis attribue un ID de sous-rapport au rapport nouvellement créé. (les sous-rapports sont des entités indépendantes et peuvent être utilisés par plusieurs rapports, d'où une zone différente en magasin)

const actions = {
    createNewReport({ state, commit }) {
        commit(mutationTypes.CREATE_NEW_REPORT)
        // below doesn't work - i can't get return from mutation
        let newSubreportId = commit(mutationTypes.ADD_NEW_SUBREPORT)
        // if this worked, i'd then do something like
        commit(mutationTypes.ADD_SUBREPORT_TO_REPORT, newSubreportId)
    }
};

Comment puis-je réaliser ce qui précède?

vue.jsvuejs2vuex
18
Rudi

Donc, la meilleure façon d'accomplir pour moi serait d'envoyer des actions au lieu de commettre les mutations. Si vous regardez les méthodes dans la source Vuex, commit ne s'exécute que (donc c'est un vide) et dispatch renvoie la valeur que vous retournez de l'action (qui est une fonction)

Pour mes actions, je retourne toujours une promesse afin que je puisse les composer comme vous le mentionnez ci-dessus. Voici un exemple.

fetchSomething ({ commit }) {
  return mockApiGetIds()
    .then(response => {
      commit({
        type: SOME_MUTATION,
        ids: response
      });

      return response;
    });
  },
12
Austio

Avertissement: je ne sais pas si c'est vraiment une bonne idée, mais au moins, cela semble fonctionner, et pour moi, c'est plus joli que d'avoir à utiliser des actions et des promesses, ou à générer l'identifiant dans le action ...

Avec votre mutation, vous pouvez passer un argument. Pour renvoyer une valeur à partir d'une mutation (comme un identifiant nouvellement créé), je l'écris dans un espace réservé dans cet argument:

someMutation(state, arg){
   //...
   arg.out = {
      status : "succeed"
   }
}

//...

this.$store.commit('someMutation', arg);
if(arg.out !== "succeed") console.log("ERROR");
6
hl037_

Ce serait formidable de le faire fonctionner en revenant d'une mutation ...

S'il vous plaît, votez pour le problème en le suivant: https://github.com/vuejs/vuex/issues/1437

Cela pourrait permettre d'avoir quelque chose comme ça à l'avenir:

let myReturn = this.$store.commit('ADD_THING",{"name":"new_thing"});
// 'ADD_THING' adds a thing to an numerically indexed object and then returns the number.
console.log(myReturn); // {"id":42,"datestamp":1541145883085}
1
Alex