useNavigation

useNavigation 是一個掛鉤，可用來存取 navigation 物件。它有助於在無法直接將 navigation 道具傳遞到元件中，或者不希望在深入巢狀的子項件中傳遞道具的情況下使用。

useNavigation() 會傳回其內部畫面的 navigation 道具。

範例

import * as React from 'react';
import { Button } from 'react-native';
import { useNavigation } from '@react-navigation/native';

function MyBackButton() {
  const navigation = useNavigation();

  return (
    <Button
      title="Back"
      onPress={() => {
        navigation.goBack();
      }}
    />
  );
}

如需更多資訊，請參閱有關 navigation 道具 的文件。

與類別元件一起使用

可以將類別元件包裝在函式元件中以使用掛鉤

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

// Wrap and export
export default function (props) {
  const navigation = useNavigation();

  return <MyBackButton {...props} navigation={navigation} />;
}