vuex haben mapState mit mehreren Modulen

Ich muss etwas fehlen. Wie kann ich vuex mapState mit mehrere Module?

Soweit verstehen, neben der übergabe eines Objekts als argument, Namespaces mapState kann auf zwei Argumente: - namespace und ein array von Objekt-Namen, die die Mitglieder der Module. Wie diese

//an imcomplete vue
export default {
   computed: mapState('user', ['addresses', 'creditCards']) 
};

Aber was ist, wenn ich möchte noch hinzufügen, Objekte aus einem zweiten namespace berechnet? z.B. Anbieter wie diese:

mapState('vendor', ['products', 'ratings'])

Derzeit bin ich verschmelzen beider mapState wie diese:

let userMapState = mapState('user', ['addresses', 'creditCards']); 
let vendorMapState = mapState ('vendor', ['products', 'ratings']);
let mergedMapStates = Object.assign({}, userMapState, vendorMapState);

Dann:

//an imcomplete vue
export default {
    computed: mergedMapStates
};

Es funktioniert, aber es ist kaum der richtige Weg, es zu tun. Oder ist es?

InformationsquelleAutor LongHike | 2017-08-09
  1. 18

    Verwenden Sie die spread-operator:

    computed: {
  ...mapState('user', ['addresses', 'creditCards']),
  ...mapState('vendor', ['products', 'ratings']) 
}
    • Habe ich falsch verstanden, diese drei Punkte als Auslassungszeichen in der Dokumentation zusammen. Ich bin noch nicht dazu gekommen verwendet, um die Ausbreitung Betreiber.
    • Funktioniert! Danke!!
    InformationsquelleAutor thanksd
  2. 9

    Dies ist aus der vuex docs, können Sie es tun alle in einer ...mapState({}). Dokumentation

    computed: {
  ...mapState({
    a: state => state.some.nested.module.a,
    b: state => state.some.nested.module.b
  })
},

    Bearbeiten 2019

    Können Sie auch einen Pfad zu Ihrer verschachtelten Modul und das Modul Referenzen cleaner (Dank @gijswijs)

    computed: {
  ...mapState('some/nested/module', {
    a: state => state.a,
    b: state => state.b
  })
},
    • Die Dokumentation (heute) ausdrücklich festgehalten, dass diese Art, die Dinge "etwas ausführlich", so die alternative, die unten erklärt werden, wird "pass der Modul-namespace-string als erstes argument an die Helfer, so dass alle Bindungen werden durch das Modul als Kontext"
    • danke, ich aktualisierte die Antwort!
    InformationsquelleAutor thedanotto
Schreibe einen Kommentar