![]()
watch의 개념 :특정 데이터의 변화를 감지하여 자동으로 특정 로직을 수행해주는 속성 1. 사용법 👉 사용자가 input에 텍스트를 입력하면 data의 message에 데이터가 동적으로 바인딩이 된다. 👉 message: function (value) { console.log("value", value); } 사용자가 input에 텍스트를 입력할때 마다 message에 데이터가 동적으로 바인딩된다. watch는 message의 값이 변경이 발생될 때마다 watch의 message 메소드가 실행되어 console.log("value", value)가 실행 된다. 주의점은 감시할 타켓명이 watch에 동일한 이름으로 사용해야한다. data에 message를 감시할려면 watch에도 동일한 이름인 messa..
1. computed : 템플릿의 데이터 표현을 더 직관적이고 간결하게 도와주는 속성 아래 코드는 message라는 데이터 속성의 문자열 순서를 역으로 변환해주는 코드이다. message 값이 만약 Hello라면 화면에 출력되는 값은 olleH로 된다. 이와 같은 계산식이 템플릿에 많아지면 템플릿의 가독성이 현저히 떨어지게 된다. 따라서 아래와 같이 computed 속성을 활용해야 한다. 1-1) computed의 사용 computed의 사용 전 {{ message.split('').reverse().join('') }} 이렇게 템플렛안에 기술하는 것이 더 편리하다. 그렇지만, 코드가 길어지면 길어질수록 점점 보기가 힘들어지고 복잡해지게 된다. 특히, 유지보수가 어려워지게 된다. computed의 사용 ..
