Maison >interface Web >js tutoriel >La paire d'objets d'exportation vuex ajoute de la valeur à l'état

La paire d'objets d'exportation vuex ajoute de la valeur à l'état

php中世界最好的语言
php中世界最好的语言original
2018-06-14 11:48:401867parcourir

Cette fois, je vais vous apporter l'objet d'exportation vuex pour ajouter de la valeur à l'état. Quelles sont les précautions à prendre pour que l'objet d'exportation vuex ajoute de la valeur à l'état. Ce qui suit est un cas pratique, jetons un coup d'œil.

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 Ajouter la valeur de l'objet exporté par vuex à l'état

Ajouter des mutations Pour changer la valeur de l'état

Ajouter 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)
})

Je crois que vous maîtrisez la méthode après en lisant le cas dans cet article, plus Veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment interagir avec les composants angulaires

Utilisez vue-route+beforeEach pour créer des gardes de navigation

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