ReactNative使用Navigation构建完整应用（一）

一、先看一下应用目前效果

二、项目结构

1.pages中是所有的页面

2.router中定义了页面的路由跳转

    路由配置学习可以到官网https://reactnavigation.org/docs/getting-started.html

    有什么问题心得可以交流，我也在学习

三、介绍下首页

1、点击登录按钮现在跳转了一个自己的布局页面，后来这里回到登录页面，

有几个模块开始写的时候直接摞代码，显得主页面代码比较多，例如

刚开始 infoItem也为普通标签写的，后来进行组件化

1.png

然后继续优化

2.png

四、在自定义组件时遇到的几个坑

1、组件名首字母要大写(^^)

2、此处有坑 原想传图片的地址过来，结果不行

require（this.props.imageStr）是错误的。

                        //错误写法

                        //source={this.props.headImage? require（this.props.headImage） : require('../../img/homeNewInfo.png')}

正确写法

                        source={this.props.headImage ? this.props.headImage : require('../../img/homeNewInfo.png')}

五，感兴趣同学到git查看代码

六、系列文章

ReactNative使用Navigation构建完整应用（一）

ReactNative使用Navigation构建完整应用（二）

ReactNative使用Navigation构建完整应用（三）

ReactNative使用Navigation构建完整应用（四）