method
는 주로 두가지 경우에 사용
1. 데이터 바인딩
2. 이벤트 바인딩
데이터 바인딩을 위해 메서드를 사용하는 경우
즉, 중괄호 사이에서 메서드를 사용해 템플릿에서 vue 인스턴스로 아웃소싱하는 경우 메서드는 컴포넌트 리렌더리어 주기에 맞춰 매번 실행됨
그러므로 변동 사항이 생기면 템플릿을 재평가하고 해당 템플릿에 호출된 모든 메서드를 다시 호출하게 됨
그래서 이벤트 바인딩 시에는 method를 주로 사용하게 되는것
computed(연산)
프로퍼티는 데이터 바인딩에만 쓰임
이벤트 바인딩엔 알맞지 않음
게다가 연산 프로퍼티는 다른 데이터를 기반하는 데이터를 가져오기에 유용하여 의존하는 데이터가 바뀔 경우에만 vue에 의해 재평가하거나 재실행 된다는 장점이 있음
즉, computed는 디펜덴시로 내부에 쓰인 데이터가 변경될 경우에만 재실행 (리엑트 useEffect와 유사한듯)
watch(감시자)
는 템플릿에 직접 사용하지 않음
템플릿 내부에서 참조하지 않지만computed를 포함해 어느 프로퍼티든 watch로 감시 가능!
게다가 데이터 변경에 대한 반응을 코드로 실행가능
예를 들어 http요청을 보내거나 타이머를 설정하거나 로컬스토리지에 데이터를 저장하는 작업 등이 있음
주로 데이터가 아닌 업데이트에 watch를 사용해야 함.
바뀌는 데이터를 토대로 데이터가 아니라 내부에서 업데이트 하는 작업이 있을 경우 사용