青いやつの進捗日記。

メモとしてべんきょうのしんちょくをかいていきます。あとで自分が検索しやすいもん

cannot assign to read only property | useStateで管理しているオブジェクトの更新をする際にイミュータブルな感じでやるようにする

qiita.com

まあどうやらオブジェクトを直接更新するの無理ってことみたい。まあstateなので直接更新するつもり無いのだけど、オブジェクトを直接更新した新しいオブジェクト作ってそれをsetする、みたいなときにも怒られちゃうので、新しいオブジェクトの作り方をイミュータブルな感じでやれば大丈夫ってことなのだと思う。

const [currentValues, setCurrentValues] = useState(initialvalues)
const newValues: any[] = currentValues.map((value) => {
  value.isHidden = hiddenName === value.name
  return newValue
})
setCurrentValues(newValues)

だとだめで、

const [currentValues, setCurrentValues] = useState(initialvalues)
const newValues: any[] = currentValues.map((value) => {
  const newValue: any = {
    name: value.name,
    isHidden: hiddenName === value.name
  }
  return newValue
})
setCurrentValues(newValues)

だと大丈夫、みたいな。