17:I[9007,["/_next/static/chunks/7fc06a08055b84ab.js","/_next/static/chunks/a493cf741f435e32.js","/_next/static/chunks/0444d85e224643eb.js","/_next/static/chunks/19d08eedfa0db71d.js","/_next/static/chunks/3c00d48348771e09.js","/_next/static/chunks/a452dd0be448cd7b.js","/_next/static/chunks/cef212f7a0c22336.js","/_next/static/chunks/3eeefd49918fa199.js","/_next/static/chunks/56180788692b9400.js"],"PostDetailsBack"] 18:I[65219,["/_next/static/chunks/7fc06a08055b84ab.js","/_next/static/chunks/a493cf741f435e32.js","/_next/static/chunks/0444d85e224643eb.js","/_next/static/chunks/19d08eedfa0db71d.js","/_next/static/chunks/3c00d48348771e09.js","/_next/static/chunks/a452dd0be448cd7b.js","/_next/static/chunks/cef212f7a0c22336.js","/_next/static/chunks/3eeefd49918fa199.js","/_next/static/chunks/56180788692b9400.js"],"PostEditButton"] 19:I[69035,["/_next/static/chunks/7fc06a08055b84ab.js","/_next/static/chunks/a493cf741f435e32.js","/_next/static/chunks/0444d85e224643eb.js","/_next/static/chunks/19d08eedfa0db71d.js","/_next/static/chunks/3c00d48348771e09.js","/_next/static/chunks/a452dd0be448cd7b.js","/_next/static/chunks/cef212f7a0c22336.js","/_next/static/chunks/3eeefd49918fa199.js","/_next/static/chunks/56180788692b9400.js"],"Separator"] 1a:I[4182,["/_next/static/chunks/7fc06a08055b84ab.js","/_next/static/chunks/a493cf741f435e32.js","/_next/static/chunks/0444d85e224643eb.js","/_next/static/chunks/19d08eedfa0db71d.js","/_next/static/chunks/3c00d48348771e09.js","/_next/static/chunks/a452dd0be448cd7b.js","/_next/static/chunks/cef212f7a0c22336.js","/_next/static/chunks/3eeefd49918fa199.js","/_next/static/chunks/56180788692b9400.js"],"Editor"] 1e:I[17260,["/_next/static/chunks/3c6c737b1782c3b1.js","/_next/static/chunks/0c290c57de7f409e.js"],"IconMark"] 1b:T6c1,// 기본적인 사용법과 UI 연동 예시 const { mutate, mutateAsync, reset, isPending, error, status } = useMutation({ mutationFn: (newPost) => updateData(newPost), // 이론적으로 중요한 전역 콜백들 onSuccess: (data) => { console.log('서버 응답 데이터:', data); // 보통 여기서 queryClient.invalidateQueries()로 데이터를 새로고침함 }, onError: (err) => { console.error('에러 로그 기록:', err.message); }, onSettled: () => { console.log('성공이든 실패든 난 끝났어!'); } }); // 1. mutate 사용: 가장 일반적인 패턴 const handleSubmit = (newData) => { mutate(newData, { // 호출 시점에만 쓰이는 로컬 콜백 onSuccess: () => { alert('저장 완료!'); } }); }; // 2. mutateAsync 사용: 비동기 흐름 제어 const handleAsyncSubmit = async (newData) => { try { const result = await mutateAsync(newData); // 결과값 result를 가지고 바로 다음 로직 수행 가능 console.log('새로 생성된 ID:', result.id); } catch (err) { // 에러를 직접 잡아야 함 console.error('호출부 에러 핸들링:', err); } }; // 3. UI 활용 예시 (상태 머신 활용) return (

{/* 에러 상태일 때 보여줄 UI */} {status === 'error' && (

앗, 문제가 생겼어: {error.message}

)}

);