ナビゲーションヘッダー

実現コード const navigation = useNavigation(); useLayoutEffect(() => { if (response && navigation) { navigation.setOptions({ title: `${response}`, }); } }, [navigation, response]); useLayoutEffectって？ 実装していて、useLayoutEffectっていうhooksが聞き覚えなさ過ぎて、react native専用のhooksだと思っていたけど、調べるとreactが用意しているhooksらしい。 useLayoutEffect useLayoutEffect は useEffect の一種ですが、ブラウザが画面を再描画する前に実行されます。 とのことで、さらに、 useLayoutEffect はパフォーマンスを低下させる可能性があります。可能な限り useEffect を使用することを推奨します。 とのことだった。できる限り使わないでほしいとのことなので知らなくても無理はなかったかもしれない。 今回は、useLayoutEffectを使用することで、タイトルが描画される前に処理が実行されるため、新しいタイトルが即座に反映されるようになっている。 ただこのコードだと、responseが取得されるまでは元のタイトルが表示されるので、responseがfalseの時の条件を付与する必要があるということにいまさら気が付いた。