const onUpdate = (item: Item): void => {
setItems((items) => {
const updated = {...items};
updated[item.id] = item;
return updated;
})
}
const onUpdate = (item: Item): void => {
setItems((items) => {
let updated = {...items};
updated = {...items, item};
return updated;
})
}
위에꺼는 함수가 호출될 때마다 정상적으로 리렌더가 잘 되는데,
아래꺼는 이상하게 페이지 리로드 후 최초 1회만 리렌더됨 ;;; 두번째 호출부터는
내부구현사항은 반영이 되는데 리렌더가 안되는데 왜 그런거냐?
ㅋㅋ콘솔 찍어보면 바로 알듯
노하우좀;;
두 번째는 { ..., item: { id: 1, ... }} 로 저장됨.
어디를찍어봐야댐?
그렇게 되면 타입에러 뜰텐데;; type Items = Item[] 거든
그럼 첫 번째도 잘못한거 아냐? onUpdate 실행하면 상태가 배열에서 객체로 바뀜
아 미안 잘못말함 export type Items = { [key: string]: Item; } 객체로 정의했엉
두 번째는 그냥 key가 item이 되는거임. { item: item }
아하 오키 이해했다 ㄳㄳ 그래서 서버에 item 전송한것만 그대로 에러없이 업데이트된거구나