Heim > Web-Frontend > js-Tutorial > Hauptteil

Einfache Verwendung von Vuex

亚连
Freigeben: 2018-05-26 16:36:31
Original
1431 Leute haben es durchsucht

vuex ist eine zentralisierte Zustandsverwaltungsarchitektur, die speziell für vue.js entwickelt wurde. In diesem Artikel wird hauptsächlich die einfache Verwendung von Vuex vorgestellt. Freunde in Not können sich auf

Was ist Vuex?

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 wird

  this.$store.dispatch("enabledcheckbox",true)
Nach dem Login kopieren

Den Wert von useredit aus dem Status abrufen

this.$store.state.useredit
Nach dem Login kopieren

2 exportiert in vuex-Objektpaaren Werte zum Zustand hinzufügen

Mutationen hinzufügen, um den Wert des Zustands 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)
Nach dem Login kopieren

In main.js

import store from './vuex'
new Vue({
 el: '#app',
 router,
 store,
 render:h=>h(App)
})
Nach dem Login kopieren

Das Obige habe ich für alle zusammengestellt. Ich hoffe, es wird für alle hilfreich sein die Zukunft.

Verwandte Artikel:

So laden Sie Dateien mit jQuery Ajax hoch

Ajax verwenden, um asynchrone Aktualisierungsanforderungen zu implementieren

Dateien über Ajax hochladen und FormData verwenden, um Ajax-Anfragen zu stellen

Das obige ist der detaillierte Inhalt vonEinfache Verwendung von Vuex. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!