[ VueJS 프로그래밍 ] ref 변수의 변경 사항 추적 및 Watch 함수 사용 - Whitmem
[ VueJS 프로그래밍 ] ref 변수의 변경 사항 추적 및 Watch 함수 사용
VueJS 개발
2025-06-10 22:52 게시 ca41dd4d98ed581f5b76

0
0
9
이 페이지는 외부 공간에 무단 복제할 수 없으며 오직 있는 그대로 게시되며 부정확한 내용을 포함할 수 있습니다. 법률이 허용하는 한 가이드 라인에 맞춰 게시 내용을 인용하거나 출처로 표기할 수 있습니다.
This page is not to be distributed to external services; it is provided as is and may contain inaccuracies.
VueJS 에서 어떤 ref 변수의 변경 사항을 추적하기 위해서 watch 라는 자체 제공 함수를 사용할 수 있다.
watch(count, (changed) => { console.log('New Value', changed) });
사용 방법은 간단하다, watch 를 import 한 뒤에 watch 함수를 호출한다. watch 함수에서 첫 번째 파라메터에는 추적할 ref 변수를, 두 번째 변수에는 콜백 함수를 넣어주면 된다. 콜백 함수에 매개 변수를 같이 넘길 수 있는데, 한 개만 넣으면 변경된 값을 담아서 호출해준다.
한편 콜백 함수에 두 개의 매개 변수를 넣으면 변경된 값, 변경 전 값 차례로 콜백 인자로 담아 호출해준다.
watch(count, (changed ,latest) => { console.log('New Value', changed, latest) });
즉 count 가 변경될 때 마다 위 콜백 함수에 적절한 인자가 담겨져 호출된다.
댓글 0개
댓글을 작성하는 경우 댓글 처리 방침에 동의하는 것으로 간주됩니다. 댓글을 작성하면 일회용 인증키가 발급되며, 해당 키를 분실하는 경우 댓글을 제거할 수 없습니다. 댓글을 작성하면 사용자 IP가 영구적으로 기록 및 부분 공개됩니다.
확인
Whitmemit 개인 일지 블로그는 개인이 운영하는 정보 공유 공간으로 사용자의 민감한 개인 정보를 직접 요구하거나 요청하지 않습니다. 기본적인 사이트 방문시 처리되는 처리 정보에 대해서는 '사이트 처리 방침'을 참고하십시오. 추가적인 기능의 제공을 위하여 쿠키 정보를 사용하고 있습니다. Whitmemit 에서 처리하는 정보는 식별 용도로 사용되며 기타 글꼴 및 폰트 라이브러리에서 쿠키 정보를 사용할 수 있습니다.
이 자료는 모두 필수 자료로 간주되며, 사이트 이용을 하거나, 탐색하는 경우 동의로 간주합니다.