Vuex가 필요한 이유, 컨셉, 구조

Vuex가 왜 필요할까?

인프런 - vue.js 캡틴판교 강좌

 

인프런 - vue.js 캡틴판교 강좌

 

Vuex 컨셉

- State: 컴포넌트 간에 공유하는 데이터 data()

- View: 데이터를 표시하는 화면 template

- Action: 사용자의 입력에 따라 데이터를 변경하는 method

 

화면에서 먼저 view에서 어떤 이벤트(action)을 발생시키면 state가 변경된다. 그럼 다시 화면(view)가 변경된다. 그렇게 돌고 돈다.

그게 vuex의 컨셉이다.

 

중요한 것은 단방향 흐름이라는 것이다.

 

Vuex 구조

 

인프런 - vue.js 캡틴판교 강좌

 

컴포넌트 -> 비동기 로직 -> 동기 로직 -> 상태

 

actions과 mutations는 둘다 function이다 하지만 둘을 나눈 것은

actions은 데이터를 불러오는 것

mutations는 state를 가공하는 것 정도로 나눈다고 한다,

개념자체는 어려우니 연습하면서 겪어야 할 것 같다.

아래의 링크는 그 내용을 풀어준 것이니 참고하자.

\

https://joshua1988.github.io/web-development/javascript/javascript-asynchronous-operation/

자바스크립트 비동기 처리와 콜백 함수