Vuex

Vuex

상탯값 관리 전문 라리브러리

store라고 들어보았다면 이해하기 쉬울 것이다. vuex가 store 관리 라이브러리다.

 

src/store/index.js

import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) export default new Vuex.Store({   state: {     sTitle: '',     address: 'xxxxxxx',     phone: '010-xxxx-xxxx',     todo: [],     book: [],     schedule: []   },   mutations: {     fnSetTodo: function (state, todo) {       return state.todo = todo     },     fnSetBook: function (state, book) {       return state.book = book     },     fnSetSchedule: function (state, schedule) {       return state.schedule = schedule     }   },   getters: {     fnGetTodo(state) {       return state.todo;     },     fnGetBook(state) {       return state.book;     },     fnGetSchedule(state) {       return state.schedule;     }   } })

 

Vue객체에서 사용하므로 어디서든 사용가능하다. 중앙집중관리를 할 수 있으므로 어느 화면에서든 데이터가 일관성이 있다.

 

*.vue 파일에서 getter setter 사용하려면

this.$store.commit('fnSetTodo', this.oTodos) this.oTodos = this.$store.getters.fnGetTodo

뷰 객체에 접근하려면 $기호를 사용한다.