본문 바로가기
  • 일하면서 배운 내용 끄적이는 블로그

vuex2

Vuex로 중앙에서 상태 관리하기 StoreVuex에서 store란 애플리케이션의 공유된 상태를 보유하고 있는 전역변수상태(State), 뮤테이션(Mutations), 액션(Actions), 게터(Getters) 라는 속성(property)를 가지는데애플리케이션 상태를 더 작은 모듈들로 나누어 구성하기 위해 모듈(Modules) 사용 가능각각의 모듈들이 위 4가지 속성을 가짐 Store의 프로퍼티들상태(State) State는 Vue 컴포넌트에서 data이다 원본 소스의 역할을 하며, View와 직접적으로 연결되어있는 Model이다. state는 직접적인 변경은 불가능하고 mutation을 통해서만 변경이 가능하다.mutation을 통해 state가 변경이 일어나면 반응적으로 View가 업데이트된다.뮤테이션(Mutations)Mutati.. 2024. 5. 7.
Props vs EventBus vs Vuex PropsVue.js에서는 부모 - 자식 컴포넌트 사이에 단방향 바인딩을 생성한다.Vue는 컴포넌트로 화면을 구성하기 때문에 같은 웹페이지라도 데이터를 공유할수 없다 따라서 부모는 Props를 통해 자식에게 데이터를 전달하고, 자식은 events(emit)을 통해 부모에게 전달한다. 예제코드 부모  자식 {{ message }}  이런 방식으로 데이터를 전달하는것은 규모가 크고 복잡해질수록 컴포넌트 간 통신 및 데이터 전달이 힘들다 그래서 다음 방법이 EventBus와 Vuex이다.EventBusEventBus는 쉽게 말하면 비어있는 Vue 인스턴스 객체이다.import Vue from "vue";var EventBus = new Vue(); 이 인스턴스를 독립적인 각 컴포.. 2024. 5. 2.