createStateNavigator
createStackNavigator提供了APP屏幕间的切换的能力,以栈的形式管理屏幕间的切换,切换的屏幕都会放在栈的顶部
createStackNavigation API
createStacknavigator(RouteConfigs, StackNavigatorConfig)
RouteConfigs(必选):路由配置对象从路由名称到路由配置映射,告诉导航器该路由呈现什么。
StatckNavigationConfig(可选)
:配置导航器的路由(如:默认首屏,navigationOptions,paths等)样式(如,转场模式mode、头部模式等)。
1.RouteConfigs
RouteConfigs支持三个参数screen
、path
以及navigationOptions
;
- screen (必选):指定一个React组件作为屏幕的主要显示内容,当这个组件被createStackNavigator加载时,它会被分配一个
navigation
prop。 - path(可选):用来设置支持schema跳转时使用,下面章节会细讲到
- navigationOptions(可选):用以配置全局的屏幕导航选项如:title、headerRight、headerLeft等;
2.StackNavigatorConfig
StackNavigatorConfig支持配置的参数 有10个
这7个根据作用不同分为路由配置、试图样式配置两类
用于路由配置的参数:
- initialRouteName: 设置默认页面组件,必须是上面(RouteConfigs)已经注册的页面组件
- initailRouteParams: 初始路由的参数
- navigationOptions: 屏幕导航默认选项
- initialRouteKey 初始路由可选标识
- paths: 用来设置scherma跳转时使用,具体下文章节讲。
用于导航样式配置的参数:
- mode: 页面切换模式
- headerMode:导航栏显示模式
- headerBackTitleVisible: 提供合理默认值以确定后退按钮标题是否可见,但是如果要覆盖它则可使用true和false在此选项中
- cardStyle: 样式(iOS上面切换会有白色蒙层,去掉这样设置,cardStyle:{ opacity: null},切换页面时页面的边框也可以这样设置)。
- onTransitionStart: 页面切换开始时的回调函数
- onTransitionEnd: 页面切换结束是回调的函数。
navigationOptions
支持以下参数


网友评论