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

vuex2

Vuex로 중앙에서 상태 관리하기 Vuex의 정의Vuex란 Vue.js에서의 상태 관리 라이브러리Vue.js 애플리케이션의 모든 컴포넌트에 대한 중앙 집중식 저장소 역할React의 Redux같은것Vuex의 특징Single Source of Truth하나의 어플리케이션은 하나의 store만 가진다하나의 객체가 어플리케이션 전체 state를 포함단일 상태 트리는 특정 state를 바로 찾을 수 있게 만들고, 현재 앱의 state의 스냅샷을 가져올 수 있어 디버깅 편리 State is Reactive상태가 변경되면 이 상태를 공유하는 다른 곳에서도 상태가 업데이트 됨  State management pattern + LibraryVuex는 상태관리 패턴이자 라이브러리여러 컴포넌트 간의 데이터 전달과 이벤트 통신을 한곳에서 관리하는 패턴을 Vu.. 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.