인프런 커뮤니티 질문&답변
작성자 없음
작성자 정보가 삭제된 글입니다.
매개변수 updatedTodo 관련 질문
해결된 질문
작성
·
35
·
수정됨
0
낙관적 업데이트시 매개변수인 updatedTodo 관련 질문이 있습니다.onMutate 에서 제공되는 매개변수는mutate 함수의 인수로부터 제공된다고 하셨는데(15:11)
즉, 현재 케이스에서는 id와 isDone만 인수로 제공되었으니 매개변수인 updateTodo에서는 content는 제외되어 있어야 하지 않나 생각을 했었는데요.onMutate 함수 내부에서 다음과 같이 캐시 업데이트한 후({...pervTodo, ...updatedTodo}) 에도 목록에서 content 값이 사라지지 않고 유지중인 점이 궁금합니다.
답변 3
1
다시 보니 제가 잘못 이해했었네요.
{...pervTodo, ...updatedTodo} 에서 스프레딩 연산자를 통해 기존 상태에서 수정된 부분만 업데이트 하고 있는 정상적인 코드였는데 제가 깊이있게 보지 못했습니다.
결론은 질문 내용이 해결되었습니다.
0
0
안녕하세요, 인프런 AI 인턴입니다. ddooww님.
리액트 프로젝트에서 낙관적 업데이트를 통해 데이터를 처리할 때, onMutate에서 제공되는 매개변수는 실제로 mutate 함수 호출 시 사용하는 인수와 연결됩니다. 이 질문에서 updatedTodo는 onMutate 함수 내에서 mutate 함수의 인수로 전달된 객체를 나타냅니다. 여기서 중요한 점은, 객체 속성인 updatedTodo가 기존의 캐시된 데이터와 합쳐질 때, 속성의 병합이 이루어진다는 것입니다.
이해를 돕기 위한 설명:
배경:
mutate호출 시에 제공된 인수가onMutate에 전달되는updatedTodo입니다.
데이터 병합:
prevTodo는 이전 상태의 모든 데이터를 포함하고 있습니다.
- 따라서,
{...prevTodo, ...updatedTodo}를 통해,updatedTodo에 포함되지 않은 속성들(예:content)도 기존의prevTodo로부터 유지됩니다.
캐시 업데이트의 결과:
updatedTodo는 변경된 값만 덮어쓰게 되므로, 빠진 속성들은 초기 캐시 데이터로부터 계속 유지됩니다. 이는Object의 구조 분해 할당을 활용하여 데이터를 합치는 방식 덕분에 가능해집니다.
이를 통해 updatedTodo에서는 변경되지 않은 필드들(예를 들어, content)이 여전히 유지되며, 변경된 값은 덮어씌워집니다. 이는 불필요한 데이터 손실을 방지하고, 사용자 경험을 향상시킵니다.
이해에 도움이 되는 리액트의 데이터 구조 병합과 상태 관리 관련 링크가 있으니 함께 참고해 보시면 좋을 것 같습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.