[220527] vuex

vuex 란

vue js 를 위한 상태 관리 패턴+라이브러리 이다.

상태란 데이터(반응성데이터) 이다.

 

- State

Vue 의 data

- Getters

Vue 의 computed

- Mutations

수정 권한이 있는 method

- Actions

 method 

- Modules

 

import {createStore} from 'vuex'

export default createStore ({
  // data
  state() {
    return {
      count: 0
    }
  },
// 계산된 data === computed
  getters:{
    double(state){
      return state.count * 2
    }
  },
  // 수정권한 메소드
  //수정권한이 있는 mutations을 직접 내보내서 쓰는 경우는 피하는게 좋음
  //수정 권한이 거의 전부
  //state에만 접근함
  mutations: {
    increase(state){
      state.count += 1
    }
  },
  // 외부에서 쓸땐 액션을껄, mutstions 는 가급적 내부에서
  // state, getters, mutations, actions 에 모두 접근
  //context
  actions: {
    // increase(context){
    increase({commit}){
      //mutations 을 호출하는 comiit, actions 를 호출하는 dispatch
      // 사용권한의 복잡함을 해결학 ㅣㅜ이해서
      // const (state, getters, commit , dispatch) = context
      // const {commit }= context
      commit('increase')
    }
  }
})

출처 패스트캠퍼스 핀테크 FE 과정 박영웅강사님