computed

computed는 vue 공식 홈페이지에서 잘 설명이 되어있다.
제가 computed를 사용해야한 이슈로는 총 3개의 컴포넌트가 존재했습니다.

1> 컴포넌트

(1) 메뉴 컴포넌트

(2) 메뉴 수정 컴포넌트

(3) 메뉴 추가 컴포넌트

2> 컴포넌트 관계

1. 메뉴 추가 컴포넌트에서 메뉴를 추가시킨다.
2. 해당 메뉴는 메뉴 컴포넌트와 메뉴수정 컴포넌트에 반영되어야 한다.

3> 해결방안

기존의 vuex의 store를 활용하고 있던 프로젝트이기에 각 컴포넌트에서 computed로 변수를 선언하여 store에 있는 데이터를 가리켜야 합니다.

...
    computed: {
        desserts(){
            return this.$store.state.menu.items
        }
    },

desserts는 store에 있는 menu 모듈의 items을 가리키고 있습니다.
desserts는 이제 다른 컴포넌트에서 값이 변경되어도 현재 사용되어지는 컴포넌트에서 변경이 되어집니다.