react-native - 如何在本机反应中从一个屏幕导航到另一个屏幕？

Question

我想创建从一个屏幕到另一个屏幕的导航。我使用了反应导航的说明。以下是我的世博小吃链接。完整的代码在那里。

链接：https ://snack.expo.dev/@john.ocean/68d88a

标签： react-native

Answer 1

编辑https://snack.expo.dev/@horstleung/smiling-chocolates

您有的问题：

1. 你的组件没有被导出，你可以参考这里

import React from 'react';
import Documents from './Documents';
import { createStackNavigator } from '@react-navigation/stack';
import Home from './Home';


import { NavigationContainer } from '@react-navigation/native';
import DetailOne from './DetailOne';
import DetailTwo from './DetailTwo';
import App from '../App';

const Stack = createStackNavigator();

const DetailStack = ({navigation}) => (
  <NavigationContainer>
  <Stack.Navigator>
    <Stack.Screen name="Home" component={App}/>
    <Stack.Screen name="DetailOne" component={DetailOne}/>
    <Stack.Screen name="DetailTwo" component={DetailTwo}/>
  </Stack.Navigator>
  </NavigationContainer>
)

2. 你不再需要一个NavigationContainer
3. 在您的 DetailStack 中，应该是 Home 组件，而不是 App

<Stack.Screen name="Home" component={App}/>