Tips

useEffect

• useEffectについて以下の違いが分かっていればOK。

useEffect( () => console.log("mount"), [] );
useEffect( () => console.log("will update data1"), [ data1 ] );
useEffect( () => console.log("will update any") );
useEffect( () => () => console.log("will update data1 or unmount"), [ data1 ] );
useEffect( () => () => console.log("unmount"), [] );

useRef

• functionのreturn内、つまりレンダリングには用いてはいけない。変数が変わってもuseStateのようにre-renderされないため。
• onHogehogeのようなイベントハンドラ内で、変数を条件に用いる場合などにuseStateではなくこちらを用いる必要がある。