如何找到关于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,
);
我只想问问大家是怎么搜索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,
);