[Vue] 컴포저블에서 props의 반응성 유지하기(feat. toRef, unref)
1. props를 인자로 넘기면 반응성을 잃는다? vue에서는 컴포저블을 사용하여 비즈니스 로직을 분리할 수 있다. 또한, 컴포저블의 인자로 반응형 변수를 전달할 수도 있다. 그러나, 반응형 변수를 컴포저블 인자로 전달하면 반응성을 잃는 경우가 발생한다. 아래 코드는 사용자 데이터를 관리하는 useUser 컴포저블이다. 이 컴포저블은 id값을 인자로 받아서, id값이 변경될 때 어떤 처리를 한다. export function useUser(id) { watch(id, () => { // 어떤 처리 }); } computed나 ref, reactive로 선언된 변수를 컴포저블의 인자로 전달하면, 인자는 반응성을 유지한다. const userId = computed(() => ...) useUser(user..
2023. 10. 29.
