Maison > interface Web > js tutoriel > Utilisation simple de vuex

Utilisation simple de vuex

亚连
Libérer: 2018-05-26 16:36:31
original
1449 Les gens l'ont consulté

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)
Copier après la connexion

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

this.$store.state.useredit
Copier après la connexion

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)
Copier après la connexion

Dans main.js

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

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal