← 문제 목록
초급
React
30P
map 안에서 key에 index 사용 문제
체크박스를 선택한 뒤 아이템을 삭제하면 엉뚱한 항목이 체크됩니다. 버그를 찾으세요:
JSX
function CheckList() {
const [items, setItems] = useState([
{ id: 1, text: 'A' }, { id: 2, text: 'B' }, { id: 3, text: 'C' }
]);
const remove = (id) => {
setItems(items.filter(item => item.id !== id));
};
return (
<ul>
{items.map((item, index) => (
<li key={index}>
<input type="checkbox" />
{item.text}
<button onClick={() => remove(item.id)}>삭제</button>
</li>
))}
</ul>
);
}
0명 풀이 · 정답률 0%