useRoute

useRoute は route オブジェクトへのアクセスを提供するフックです。route プロップをコンポーネントに直接渡すことができない場合や、深くネストされた子コンポーネントに渡すことを避ける場合に便利です。

useRoute() は、呼び出し元画面の route プロップを返します。

例

import * as React from 'react';
import { Text } from 'react-native';
import { useRoute } from '@react-navigation/native';

function MyText() {
  const route = useRoute();

  return <Text>{route.params.caption}</Text>;
}

route プロップ のドキュメントで詳細を確認してください。

クラスコンポーネントでの使用

クラスコンポーネントを関数コンポーネントで囲んで、フックを使用できます。

class MyText extends React.Component {
  render() {
    // Get it from props
    const { route } = this.props;
  }
}

// Wrap and export
export default function (props) {
  const route = useRoute();

  return <MyText {...props} route={route} />;
}