Vuex 사용 단계 분석

php中世界最好的语言
풀어 주다: 2018-05-03 15:42:34
원래의
1735명이 탐색했습니다.

이번에는 vuex 사용 단계에 대한 분석을 가져오겠습니다. vuex 사용 시 주의 사항은 무엇입니까?

Vuex란 무엇인가요?

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

1. vue 구성 요소에서

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

  this.$store.dispatch("enabledcheckbox",true)
로그인 후 복사

상태에서 useredit 값 가져오기

this.$store.state.useredit
로그인 후 복사

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

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

Addactions to 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)
로그인 후 복사

in main.js

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

Summary

믿습니다 이 사례를 읽었습니다. 방법을 익힌 후 PHP 중국어 웹사이트의 다른 관련 기사를 주목하여 더 흥미로운 내용을 확인하세요!

추천 자료:

Vue는 Echarts 구성 요소의 동적 새로 고침을 구현합니다

부트스트랩에서 selectpicker를 사용하여 드롭다운 상자를 구현합니다

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

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!