dev/vue3
watch란?
dev_0hoon
2025. 1. 25. 09:44
watch API도 컴포지션 API에서 사용하는 watch 속성을 의미한다.
watch 속성
watch API
export default {
props:['todoItems', 'userId'],
setup(props, context) {
function remove(item,index) {
localStorage.removeItem(item);
context.emit('remove',index);
}
watch(props.todoItems, (newValue)=>{
console.log({newValue});
})
return {remove}
}
}
위처럼 watch를 사용하면 todoItems가 바뀔 때마다 그 새롭게 바뀐 값이 newValue로 넘어온다.
watch는 최대한 사용하지 않는 것이 좋다. 많아지면 추적이 어렵기 때문이다. 기존의 emit, props 등을 이용해서 데이터를 운용하는 것이 바람직하다.