Question

我让自己熟悉新的反应导航版本。我在使用navigation.navigate方法时遇到问题。

当前行为

当我们单击菜单按钮时，它会引发错误- 设备：（65:24）未定义不是对象（正在评估“ navigation.navigate”）预期行为

点击菜单按钮时，应打开抽屉如何繁殖

https://snack.expo.io/W0dye1bLt

Answer 1

虽然FooterComponent在NavigationContainer内部呈现，但它不是屏幕，也不是在任何导航器内部，因此它将没有可用的导航上下文，并且将无法从{{1 }}。

但是，对于此特定问题，有一种解决方法，您可以为NavigationContainer创建一个引用，然后将该引用传递给FooterComponent。 the "Navigating without navigation prop" section of React Navigation docs中对此进行了详细描述。将其应用于您的零食时，需要进行以下更改（加上相关的进口商品）：

useNavigation

const Navigator = () => {
  const navigationRef = useRef();

  return (
    {...}
      <NavigationContainer ref={navigationRef}>
        {...}
        <FooterComponent navigationRef={navigationRef} />

然后可以将相同的方法与const FooterComponent = ({ navigationRef }) => { {...} <TouchableOpacity onPress={() => navigationRef.current.dispatch(DrawerActions.openDrawer()) }>或navigationRef.current.navigate('Notifications')用于其他标签。

您可以在以下位置看到这适用于您的小吃：https://snack.expo.io/POeoVzAsG

导航器外部导航不起作用

1 个答案: