Dieses Mal werde ich Ihnen die Schritte zur Verwendung von Vuex ausführlich erklären. Was sind die Vorsichtsmaßnahmen bei der Verwendung von Vuex? Hier sind praktische Fälle.
vuex ist eine zentralisierte Zustandsverwaltungsarchitektur, die speziell für vue.js entwickelt wurde. Zustand? Ich verstehe es als den Teil des -Attributs in Daten, der mit anderen Vue-Komponenten geteilt werden muss, 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 wird
this.$store.dispatch("enabledcheckbox",true)Erhalten Sie den Wert von useredit aus dem Status
this.$store.state.useredit
2 Addieren Sie den Wert des von vuex exportierten Objekts zum Status
Mutationen hinzufügen, um den Wert des Zustands zu ändern
Aktionens 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 dir Ich habe es gemeistert, nachdem ich den Fall in diesem Artikel gelesen habe. Weitere spannende Methoden finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!
Empfohlene Lektüre:
vue+axios zur Implementierung der Dateninteraktion
Detaillierte Erläuterung der praktischen Fähigkeiten von Angular Component
Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Vuex-Nutzungsschritte. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
