반응형 vuex2 Actions (vuex) mutation(state를 관리, 변화 시키는 역할)은 모든 기능이 동기로 동작한다. 하나의 데이터에 여러개의 컴포넌트가 접근하려고 할 때 효율적으로 관리하기 위함인데 비동기 로직들이 포함되면 그 순서를 정확하게 알기 어렵다. 그래서 비동기 로직은 Actions를 이용한다. ex) actions의 예제 회원가입시 서버와 통신을 할때 회원가입의 중복검사, 등등의 함수를 실행한 후 state에 추가해달라는 값을 마지막에 commit한다. mutations을 통해 state를 변화시키고, 해당 mutation을 동작시키는 비지니스 로직으로 Actions를 사용한다. mutations을 commit해서(발생시킴) state의 값을 변경했다면 컴포넌트에서 Actions를 실행시키는 것은 Dispatch를 이용한.. 2023. 1. 17. getter, mapGetters, mapState (vuex) 보통의 store의 state값을 불러와서 사용할 때 v-for="(user, index) in allUsers" v-for="(user, index) in $store.state.allUsers" ... mounted() { EventBus.$on('signUp', users => { this.$store.state.allUsers.push(users) }) } 기존 data => store의 state로 옮김 getter All Users{{ $store.state.allUsers.length}} ex) 여러개의 컴포넌트에 모든 유저의 수를 출력해야 하는 경우 반복되는 코드를 computed속성과 비슷한 getter을 이용해서 코드를 줄일 수 있다. export default new Vuex.Stor.. 2023. 1. 16. 이전 1 다음 728x90 반응형
