引言
react-native-router-flux 是一个基于 react-navigation 路由框架,进一步简化了页面跳转的步骤,并且一直随着 react-navigation升级更新版本。而且使用这个框架的话,可以将全部的页面跳转的处理逻辑都写在一个地方,方便了后续的维护。
如何导入 react-native-router-flux 这个可以看官网,这里我就直接上代码了:
<code>pageone</code> 的核心代码,点击 <code>text</code> 跳转到下一个页面:
<code>pagetwo</code> 的核心代码:
页面之间的切换自然不会缺少数据的传递,而且这个路由框架可以实时 <code>refresh</code> 当前页面。
先看页面之间传递数据吧,这里添加一个 <code>pagethree</code> 吧:
很自然的,<code>pagetwo</code> 也要修改一下代码:
最后到 <code>root.js</code> 添加新的 <code>scence</code> :
可以看到从 <code>pagethree</code> 回到 <code>pagetwo</code> 数据传递并刷新页面的效果,不过如果需要实时刷新当前页面呢?这时就需要使用 <code>actions.refresh</code> 方法了:
通过设置 <code>scene</code> 属性的 <code>tabs</code> 可以设置 tabs 。这个也开发中经常用到的页面效果
此时运行就可以看到下面的效果: