Maison  >  Article  >  interface Web  >  Utilisation simple de vuex

Utilisation simple de vuex

亚连
亚连original
2018-05-26 16:36:311444parcourir

vuex est une architecture de gestion d'état centralisée spécialement conçue pour vue.js. Cet article présente principalement l'utilisation simple de vuex. Les amis qui en ont besoin peuvent se référer à

Qu'est-ce que Vuex ?

vuex est une architecture de gestion d'état centralisée spécialement conçue pour vue.js. État? Je le comprends comme la partie où les attributs des données doivent être partagés avec d'autres composants de vue, appelés état. En termes simples, ce sont les attributs qui doivent être partagés dans les données.

1. Dans le composant vue

exécutez la méthode activécheckbox, true est le paramètre utilisé pour modifier la valeur dans l'état

  this.$store.dispatch("enabledcheckbox",true)

Obtenir la valeur de useredit à partir de l'état

this.$store.state.useredit

2 Dans l'objet exporté par vuex, ajoutez des valeurs à l'état

Ajoutez des mutations pour changer la valeur de l'état

Ajoutez des actions aux mutations

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)

Dans main.js

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

Ce qui précède est ce que j'ai compilé pour tout le monde . J'espère que cela sera utile à tout le monde à l'avenir.

Articles connexes :

Comment télécharger des fichiers à l'aide de jQuery Ajax

Utiliser ajax pour implémenter des demandes d'actualisation asynchrones

Téléchargez des fichiers via Ajax et utilisez FormData pour effectuer des requêtes Ajax

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn