Conversation
There was a problem hiding this comment.
현재 데이터 요청하시면서 탠스택 쿼리를 쓰시는 곳에 기준이 있으실까요?
There was a problem hiding this comment.
보통 GET에는 항상 탠스택 쿼리를 사용하는 것 같습니다.
값을 캐싱해주기 때문에 불필요하게 데이터가 반복적으로 갱신되어 화면에서 깜빡 거리는 것을 최소화할 수 있고,
select 옵션을 통해 값을 가공하거나, isLoading, isPending 등 상태값을 제공해주는 것도 자주 사용하기 때문에
GET을 통해 데이터를 받아올 때에는 별다른 기준 없이 항상 사용하고 있습니다.
| { once: true } | ||
| ) | ||
| const totalPage = ref(0) | ||
| const totalPage = computed(() => { |
There was a problem hiding this comment.
오 watch와 computed를 사용하시는 기준이 있으신가요?
저번에 설명해주신거 같은데 기억이 안나네요 하하..
저는 주로 비동기작업이 필요하면 watch를 주로 사용하는거 같아서요
There was a problem hiding this comment.
제가 watch와 computed를 사용하는 기준은 '행동'이 필요한 것인가 '결과값'이 필요한 것인가로 나뉘는 것 같습니다.
말씀하신대로 비동기 작업이나 함수 호출로 인한 행동이 필요할 때는 watch를 사용하는 것 같고,
특정 값을 기반으로 하여 간단한 변환값을 도출해내야 할 때는 computed를 사용하는 것 같습니다.
computed는 값을 캐싱하여 계산에 관여하는 값이 변하지 않으면 다시 호출되지 않는다는 장점도 있는만큼 computed로 해결할 수 있는 상황에서는 watch가 아닌 computed를 사용하는 것 같습니다.
+Vue의 공식 문서에서도 computed로 처리할 수 있다면 watch보단 computed를 사용하는 것을 권장하고 있습니다!
Minkyu0424
left a comment
There was a problem hiding this comment.
고생하셨습니다 금방금방 하시네요
주로 tanstack 사용하실 때 api 페칭 함수 분리는 잘 안하시나요? 저는 주로 분리해서 사용했어서 이렇게하는 경우 재사용성이 좀 떨어지지 않을까요
물론 한 컴포넌트에서만 사용되는 경우라면 무방하다고 봅니다!
엇 저도 항상 fetch 함수를 분리해서 사용하고 있습니다. |
#️⃣연관된 티켓 넘버
📝작업 내용
🏞️스크린샷 (선택)
💬리뷰 요구사항(선택)