React Native学习(三)—— 使用导航器Navigation跳转页面

参考文档https://reactnavigation.org/docs/navigators/navigation-prop

一、基础 1、三种类型

TabNavigator —— 用于设置多个选项卡的页面

StackNavigator —— 用于页面之间的跳转

DrawerNavigator —— 用于侧面滑出的抽屉效果

  2、属性配置

navigate(routeName, params, action) —— 跳转页面

routeName:目标路由名称

params:传递参数(目标页面用this.props.navigation.state.params可以取出参数)

action:在子页面运行的操作(没用过,有需要可以参看官方文档)

state —— 当前页面的状态

例如,传递的params就存在state中

setParams —— 设置路由参数

goBack —— 关闭当前页面,返回上一页

也可以设置返回到指定页(如:a-->b-->c-->d,如果goBack(),则d返回到c;如果goBack(b),则d返回到a)

dispatch —— 发送一个动作到路由(没用过,有需要可以参看官方文档)

二、实例

安装react-navigation

npm install react-navigation --save

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wppwsj.html