chan_tameのブログ

プログラミングで詰まった点を記録していきます!

useStateの更新する関数について

React hooks のuseState。これなんだかんだ一番使うます...

 

勿論 const [todos, setTodos] = useState()としたらtodosが状態変数で、setTodosがそれを更新する関数なんだけれども、中に何を追加するかで形が変わるみたいなので忘れないようメモっとくます。

 

オブジェクト型というか、複数のプロパティ持たせたりしたいって時は、書き方ややこしめになるます!!

 

setTodos((prev) => {
return [...prev, {name:name, id:uuidv4(), completed: false}]
})

 

↑例えばこんな感じ!↑

 

prevというのは、勿論値はなんでもOKで、これは追加する以前のtodosのことっす。その以前のtodosをスプレッドで展開したら、追加したいオブジェクトを{}で括って書いていくます。

 

プリミティブ型とかいう、オブジェクトじゃない簡単なやつならsetTodos(〇〇)で終わりなんだけれども、オブジェクトを追加したい時はこういう感じにするます。

 

とにかく、useStateでオブジェクト型のものを追加したいなら、スプレッドで展開して書く!

 

以上。