Reactの公式ドキュメント読んでみたその3 HOOKS編

今回はReactのHooksの公式ガイドを読んでみた。
Hooksはこれまで仕事などで使っていたので、割とわかっていると思っていたが、思いのほか知らないことが多かった。やっぱり公式を読んでおくのは大事。
ただ、まだパフォーマンスを気にするほどの画面は作ったことがないので、その辺は飛ばしている。
あと、まだ使ったことのない useMemo とか useCallback などは、また別の記事に使い心地について書くようにしたい。

前回のstateやpropsの取得

ja.reactjs.org refを使って自分でやる必要があるのか。
refってフォームの入力値を取得するためにしか使ってこなかったけど、こういう使い方もあるのね。

DOMノードの位置とサイズの測定

ja.reactjs.org こういうのもref使うのか。
思ったよりrefって活躍しそうだからちゃんと使えるようになっておこう。
どうでもいいけど、refってTypeScriptで書きにくい気がする。

`useEffect`内で使用する関数の宣言場所

ja.reactjs.org これ今やっている仕事でちょうどダメな例の方をやってしまっていた... 出社したら修正しておこう。
というか、基本的に、useEffect 内で使う関数は、もしその関数がstateやpropsを使うならuseEffectの中に書いておけって話か。
何でもかんでも内部に書くと見通しが悪くなってあまり好きじゃないんだけど、そっちのほうが安全そう。単純に計算結果を返すだけの関数なら外部に書いても大丈夫みたいだけどね。