ネコニキの開発雑記

【React】Stateに配列を持つ場合の注意点Reactを初学者に教える機会があり、その時によくハマりがちなのが「stateに配列でデータを持たせた時に、正しく更新できていない」ケースです。 エラーで落ちるわけでなく、renderがかからない等の気づきにくい不具合なので、原因特定がしにくいですが大体はこの記事の例に収まると思います。 前提条件 reactの初級者向け コンポーネントのstateに配列でデータを保持している 概要 stateに配列としてデータを持っていて更新する場合、取得した配列を破壊的に変更してはいけません。 具体的には要素追加のpushや要素削除のspliceなどがあたります。 import {useState} from 'react'; const AnyComponent = () => { const [list, setList] = useState([1,