Reactコンポーネントで、初期値にpropsの値を設定したinput要素を描画したのだが、ブラウザからinput要素の値を変更しようとしたところ編集できなくなってしまった。
![](https://i0.wp.com/chusotsu-program.com/wp-content/uploads/2021/12/image-7.png?resize=1024%2C610&ssl=1)
どうやらReactのpropsを初期値として設定する場合は、以下のようにdefaultValue
を使用しなければならないようだ。
<input className="input" type="text" name="taskName" defaultValue={task.name} />
![](https://i0.wp.com/chusotsu-program.com/wp-content/uploads/2021/12/image-8.png?resize=1024%2C370&ssl=1)
これで無事編集できるようになった。