Vue.js[vuex], wie der Versand von einer mutation?

Habe ich eine Liste von filtern, die ich anwenden möchten, um ein json-Objekt.

Meine Mutationen wie folgt Aussehen:

const mutations = {
    setStars(state, payload) {
        state.stars = payload;
        this.dispatch('filter');
    },

    setReviews(state, payload) {
        state.reviews = payload;
        this.dispatch('filter');
    }
};

Weil, wie Filter arbeiten, da ich wieder anwenden müssen Sie alle wieder, da kann ich nicht einfach zu halten downfiltering eine Liste, weil das bringt mich in Schwierigkeiten, wenn ein Benutzer de-wählt eine filter-option.

So, wenn eine mutation an einer stars-filter oder Bewertungen filtern(Benutzer-Filterung), die ich brauche, um eine Funktion aufzurufen, die läuft alle meine Filter.

Was ist meine einfachste option hier? Kann ich irgendeine Art von Hilfsfunktion oder möglich eine Aktion einrichten, die Anrufe, die Mutationen, die filter eigentlich meine Ergebnisse?

  • Wenn Sie brauchen, um wieder eine gefilterte Daten, gibt es keine Notwendigkeit zu mutieren Ihre Lagerung. Ihre Daten bleiben intakt, und erstellen Sie eine get-Methode gibt die gefilterten Daten, entweder 2 Getter (1 für jeden Fall) oder eine einzelne get-akzeptiert ein argument (Filterbedingung). Verwandte Lesen: vuex.vuejs.org/en/getters.html
  • Ich würde dir Zustimmen, wenn es nur einen filter, aber ich brauche mehrere Filter anwenden, auf einmal für einen einzigen Wert. So kann ich nicht nur 1 oder 2 Getter separat. Sie müssen zusammen arbeiten.
  • Ein getter kann ein getter.
  • stimmt, aber ich müsste alle getter aufrufen, alle anderen getter, der ein filter-und dies für alle Getter. Es würde ein Durcheinander, wirklich schnell. Vielleicht sehe ich nicht wirklich, was du meinst, aber danke für den Tipp trotzdem!
  • Hier ist, was ich meine, im Grunde: jsfiddle.net/wostex/u2yoLgLb
  • Die Sortierung scheint ein anderes Konzept. Mit einem filter muss ich mindestens eine mutation zu meinem Speicher, denn mein Shop muss wissen, welche Elemente Sie brauchen werden, um gefiltert. Vielen Dank für dein Beispiel ist zwar, hilft immer.
  • Filter ist der gleiche: jsfiddle.net/wostex/u2yoLgLb/1 überprüfen Sie ein Suchfeld. Was ich versuche zu sagen ist, dass Sie nicht wirklich brauchen, zu mutieren, so etwas in den meisten Fällen, wenn Sie müssen einen filter (nur durch Vuex-design, es ist nicht erforderlich, jedoch). Dies ist, wie Sie erhalten werden können Daten für die zukünftige Verwendung, wenn der Benutzer löscht die Filter zum Beispiel. Es ist besser, meiner Meinung nach zu filter in einer Komponente selbst oder mit einem getter. Verkettete Filter kann leichter zu implementieren, die in einer Komponente selbst mit den Methoden. Vielleicht ist Ihre app ist völlig anders, obwohl, ich weiß nicht.

InformationsquelleAutor Stephan-v | 2017-06-01
  1. 27

    Mutationen können nicht Versand weitere Aktionen, aber Aktionen kann der Versand anderen Aktionen. So eine option zu haben, eine Handlung zu Begehen, die die mutation auslösen dann die filter-Aktion.

    Andere option, wenn es möglich wäre, alle Filter werden getters dass nur natürlich reagieren auf änderungen der Daten wie eine berechnete Eigenschaft.

    Beispiel der Aktionen fordern andere Maßnahmen:

    //store.js
export default {
  mutations: {
    setReviews(state, payload) {
      state.reviews = payload
    }
  }

  actions: {
    filter() {
      //...
    }

    setReviews({ dispatch, commit }, payload) {
      commit('setReviews', payload)
      dispatch('filter');
    }
  }
}


//Component.vue
import { mapActions } from 'vuex';

export default {
  methods: {
    ...mapActions(['setReviews']),
    foo() {
      this.setReviews(...)
    }
  }
}
    • Also bei jeder mutation, die ich tun, muss ich anrufen, eine Botschaft, die gerade nach es aus meiner Vue Komponenten? Da bin ich nicht in der Lage, um eine Aktion aus einer mutation in meinem Vuex-Shop?
    • eigentlich müsste ich die Komponenten versenden setReviews Aktion statt von einer mutation. Die Aktion kann sowohl das Begehen der setReviews mutation und trigger die filter Aktion.
    • Macht Sinn. Wie kann ich richtig rufen Sie eine andere Aktion aus eine Aktion innerhalb meiner Vuex speichern aber?
    • Aktionen erhalten context als ersten parameter enthält eine dispatch Funktion, die Sie verwenden können. Ich habe meinen Beitrag aktualisiert, mit einem schnellen, ungeprüften Beispiel
    • Vielen Dank, Mann!
    InformationsquelleAutor Matt
Schreibe einen Kommentar