【ReactNative】通知をタップして任意の画面を起動したい

通知をタップして任意の画面を起動したい。 Expoの通知機能を使います。

Notificationを受け取ってアクションさせる

これをルートコンポーネントに置いておくと、通知を開いたときに実行される。 dataも受け取れる。

Notifications - Expo Documentation

React.useEffect(() => {
    (() => {
      const subscribeNotification = (notification) => {
      const { data = {} } = notification;

        if (notification.origin === 'selected') {
          if (screen) {
            // アプリがバックグラウンドまたは、開かれていない状態で通知を開いた場合
            
          } else if (notification.origin === 'received') {
            // アプリが開かれている場合
            
          }
        }
      };

      Notifications.addListener(subscribeNotification);
    })();
  }, []);

NavigationContainerから画面遷移するには？

NavigationContainerを設置したコンポーネントで画面遷移をするため、props.navigationを呼び出したいが取得できない問題が発生。
下記のマニュアルどおりにrefをとって渡す必要がある。

App containers | React Navigation

useRefについては読んだがあまりイメージがつかめなかった。

フック API リファレンス – React

ルートからの指定なのでネストさせるため、paramに順番に設定する。

Nesting navigators | React Navigation

function AppNavigator(props) {
  const ref = React.useRef(null);

  ...


       if (notification.origin === 'selected') {
          if (screen) {
            // アプリがバックグラウンドまたは、開かれていない状態で通知を開いた場合
            
            ref.current?.navigate('MainStack', {
              screen: 'Main',
              params: {
                screen: 'NotificationTab',
              },
            });
          }

 .....

return (
    <NavigationContainer ref={ref}>
       <RootStack.Navigator>
          ....
       </RootStack.Navigator>
    </NavigationContainer>