Доступ к навигации React-Native без реквизита - PullRequest
Новая
       8

Доступ к навигации React-Native без реквизита

1 голос
/ 01 апреля 2020

Я сделал небольшой вспомогательный компонент 

 const NavHelper = ({ navigation, dest }) => {
  return (
    <TouchableOpacity onPress={() => navigation.navigate(`${dest}`)}>
      <Text>Go to {dest}</Text>
    </TouchableOpacity>
  );
};

Он работает, отправляя навигацию в качестве реквизита. 

<NavHelper navigation={navigation} dest="List" />

Но так как этот компонент всегда будет использовать навигацию, было бы неплохо, если бы я может получить доступ к навигации, не отправляя ее как реквизит, чтобы избежать повторения.

https://reactnavigation.org/docs/connecting-navigation-prop/

На домашней странице сказано, что вы можете сделать это, используя 

import { useNavigation } from '@react-navigation/native';

const NavHelper = ({ dest }) => {
  const navigation = useNavigation();
  return (
    <TouchableOpacity onPress={() => navigation.navigate(`${dest}`)}>
      <Text>Go to {dest} Demo</Text>
    </TouchableOpacity>
  );
};

Но когда я пробую этот подход в моем компоненте, эмулятор говорит, что не может найти объект навигатора. Чего мне не хватает?

1 Ответ

0 голосов
/ 06 апреля 2020

Простое решение, оказывается, есть несколько версий реагирования-навигации, и я искал документацию для 5.x при использовании 4.x.

Я должен был использовать https://reactnavigation.org/docs/4.x/connecting-navigation-prop

...