[Vue] Computed와 Methods

Computed

• 인자 값을 받지 않음 (가능하긴 하나 인자 값을 받으면 computed의 특장점인 캐싱 기능이 없어지기 때문에 권장되지 않음)
• 주로 기존 데이터를 재조립, 계산해서 template에서 사용하는 용도
• 캐시가 저장된다.
• computed 속성에서 사용된 데이터와 연결되어 값이 변할때만 재실행된다.

 

Methods

• 인자 값을 받을 수 있음
• 주로 이벤트 발생에 따른 기능들, 반복되는 로직들을 묶을 때 사용
• 캐시가 저장되지 않는다. 
• methods 속성에서 사용된 데이터와 연결되지 않아, update라이프 사이클이 동작할때마다(특정 변수가 바뀔 때마다) 재실행된다.

 

 

 

 

참고

https://stackoverflow.com/questions/40522634/can-i-pass-parameters-in-computed-properties-in-vue-js 

https://vuejs.org/v2/guide/computed.html

https://kamang-it.tistory.com/entry/Vue23computed-%EA%B7%B8%EB%A6%AC%EA%B3%A0-methods%EC%99%80%EC%9D%98-%EC%B0%A8%EC%9D%B4featwatch