Vuex 사용 단계에 대한 자세한 설명

이번에는 vuex를 사용하는 단계에 대해 자세히 설명하겠습니다. vuex 사용 시 주의사항은 무엇인가요?

vuex는 vue.js를 위해 특별히 설계된 중앙 집중식 상태 관리 아키텍처입니다. 상태? 나는 이것을 상태라고 불리는 다른 vue 구성 요소와 공유해야 하는 데이터의 property 일부로 이해합니다. 간단히 말해서 데이터에서 공유해야 하는 속성입니다.

1. vue 구성 요소에서

enabledcheckbox 메소드를 실행합니다. true는 상태의 값을 변경하는 데 사용되는 매개변수입니다.

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

상태에서 useredit 값 가져오기

this.$store.state.useredit

2 객체 내보내기 vuex에서 상태에 값을 추가

상태 값을 변경하려면 변이를 추가하세요

main.js에서 actions를 변이에 추가

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)

main.js

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

를 읽으신 후 방법을 마스터하신 것 같습니다. 이 기사의 경우 더욱 흥미진진합니다. PHP 중국어 웹사이트의 다른 관련 기사도 주목해 주세요!

추천 도서:

vue+axios로 데이터 상호작용 달성

Angular Component 실무 기술 상세 설명

위 내용은 Vuex 사용 단계에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!