Heim > Artikel > Web-Frontend > Das Vuex-Exportobjektpaar fügt dem Status einen Mehrwert hinzu
Dieses Mal bringe ich Ihnen das Vuex-Exportobjekt, um dem Status einen Mehrwert zu verleihen. Was sind die Vorsichtsmaßnahmen für das Vuex-Exportobjekt, um dem Status einen Wert hinzuzufügen?
vuex ist eine zentralisierte Zustandsverwaltungsarchitektur, die speziell für vue.js entwickelt wurde. Zustand? Ich verstehe darunter den Teil, in dem die Attribute in den Daten mit anderen Vue-Komponenten geteilt werden müssen, was als Zustand bezeichnet wird. Einfach ausgedrückt sind es die Attribute, die in den Daten gemeinsam genutzt werden müssen.
1. Führen Sie in der Vue-Komponente
die Methode „enabledcheckbox“ aus. „true“ ist der Parameter, der zum Ändern des Werts im Status
verwendet wirdthis.$store.dispatch("enabledcheckbox",true)
Erhalten Sie den Wert von useredit aus dem Status
this.$store.state.useredit
2 Fügen Sie den Wert zum Status im von vuex exportierten Objektpaar hinzu
Fügen Sie Mutationen hinzu, um den Statuswert zu ändern
Aktionen zu Mutationen hinzufügen
import Vue from 'vue' import vuex from 'vuex' Vue.use(vuex) export default new vuex.Store({ state: { useredit: false, }, mutations: { ENABLEDCHECKBOX(state, value) { state.checkboxDisable = value }, }, actions: { enabledcheckbox({ commit }, value) { commit('ENABLEDCHECKBOX', value) }, } }) //console.log(vuex)
in main.js
import store from './vuex' new Vue({ el: '#app', router, store, render:h=>h(App) })
Ich glaube, Sie haben die Methode gemeistert, nachdem Sie den Fall in diesem Artikel gelesen haben. Für weitere spannende Informationen achten Sie bitte auf andere verwandte Themen im Artikel zur chinesischen PHP-Website!
Empfohlene Lektüre:
So interagieren Sie mit Angular-Komponenten
Verwenden Sie vue-route+beforeEach, um Navigationsschutzvorrichtungen zu erstellen
Das obige ist der detaillierte Inhalt vonDas Vuex-Exportobjektpaar fügt dem Status einen Mehrwert hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!