vue

Vuex 기술 요소

참고자료

1. state

• 전역적으로 사용하게 끔하는 데이터

2. getter

• 기능을 좀더 함수화해서 기능별로 호출 가능하게끔 한거

3. mutation

• state 값을 변경하는 유일한 방법
• commit() 으로 동작!

3-1. 😛 왜 state 직접 변경하지 않을까?

• 여러 개의 컴포넌트에서 state 값 변경 시 추적 어려움 ㅠ,ㅠ
• 특정 시점에 어떤 컴포넌트가 state 접근하여 변경한 건지 확인 어려움
• 뷰의 반응성 거스르지 않게 명시적으로 상태 변화 수행 >> 반응성, 디버깅, 테스팅 혜택

4. actions

• 뮤테이션 중 비동기 처리 로직들을 정의하는 속성
  • 동기 처리 >> 뮤테이션
  • 비동기 처리 >> 액션

4-1. 😛 왜 비동기 처리 로직은 actions에 선언해야 할까?

• 언제 어느 컴포넌트에서 해당 state 호출하고 변경했는지 확인 어려우니까 ㅠ ,ㅠ
• 여러 개의 컴포넌트에서 mutations로 시간 차를 두고 state를 변경하는 경우
• ⭐state 값의 변화를 추적하기 어렵기에 mutations 속성에는 동기 처리 로직만 넣어야 함!!!!