如何找到关于React native createStackNavigator配置的文档

How to find the document about React native createStackNavigator configuration

我只想问问大家是怎么搜索material的。让我再解释一下。

我发现了两种创建堆栈导航器的方法是:

首先(在文档中提到):

import { createStackNavigator } from '@react-navigation/stack';

const Stack = createStackNavigator();

function MyStack() {
  return (
    <Stack.Navigator>
      <Stack.Screen name="Home" component={Home} />
      <Stack.Screen name="Profile" component={Profile} />
      <Stack.Screen name="Settings" component={Settings} />
    </Stack.Navigator>
);

}

其次(不知道大家是怎么知道的):

export const StackNavigator = createStackNavigator(
  {
    Home: {screen: Home},
    Profile: {screen: Profile},
    Settings: {screen: Settings},
  },
  stackNavigatorConfig,
);

在react navigation的首页https://reactnavigation.org/docs/stack-navigator/,文档中没有提到第二个例子createStackNavigator时如何使用对象进行配置

我不知道人们如何搜索 material。为什么我找不到他们?我的学习方式有什么遗漏吗?

您必须使用第一种方法,即新版本 (v5) 的 React 导航,并且您共享的文档包含您需要的所有信息。

至于现在配置它的所有道具,如果你想有导航级别设置你可以使用 screenOptions https://reactnavigation.org/docs/screen-options/#screenoptions-prop-on-the-navigator

    <Stack.Navigator
      initialRouteName="Home"
      headerMode="screen"
      screenOptions={{
        headerTintColor: 'white',
        headerStyle: { backgroundColor: 'tomato' },
      }}
    >
      <Stack.Screen
        name="Home"
        component={Home}
        options={{
          title: 'Awesome app',
        }}
      />
</Stack.Navigator>

你也可以有屏幕级别选项 https://reactnavigation.org/docs/screen-options/

对于旧版本的文档,您可以使用文档中的版本选项进行切换。 https://reactnavigation.org/versions

有不同的 react-navigation 版本:

版本5.X:

从“@react-navigation/stack”导入{createStackNavigator};

const Stack = createStackNavigator();

function MyStack() {
  return (
    <Stack.Navigator>
      <Stack.Screen name="Home" component={Home} />
      <Stack.Screen name="Profile" component={Profile} />
      <Stack.Screen name="Settings" component={Settings} />
    </Stack.Navigator>
);
}

文档:https://reactnavigation.org/docs/stack-navigator

版本4.X:

export const StackNavigator = createStackNavigator(
  {
    Home: {screen: Home},
    Profile: {screen: Profile},
    Settings: {screen: Settings},
  },
  stackNavigatorConfig,
);

文档:https://reactnavigation.org/docs/4.x/stack-navigator