react native 开发笔记（二）

react

1、按照前文配置好文件之后，便可以生成目录

（1）按照小兄弟的步骤生成项目：react-native init name

（2）目录结构

index.ios.js和index.android.js为入口文件，这边因为没有mac电脑，所以先研究的是android。

打开 index.android.js文件，

如图所示：首先是平台判断---》入口处是重新定义的---》在根目录下新建JS文件夹---》新建img放置图片--》ini放置配置文件。

（3）进入入口文件看看

如图所示：ini中定义的是三个基本配置文件。关于设置宽高和http封装都可以在网上百度或者自己来写。

http封装主要就是定义get和post的方式，如何传值，如何请求等。

（4）接下来，引入路由

在react native中，组件的导入导出定义：

1、导入：import 组件名称 from 从哪导入在进行导入时使用关键字 import from 、便可以把一个

组件进行导入

2、导出：export default class Button extends Component {}

“default”代表该组件是默认加载的组件,当在其他页面用到该组件时，不用加大括号就可以直接用：

import React, { Component } from 'react'; // 导入默认组件，与非默认组件

import Button from 'react-native-button'; //button是默认组件，不需要加括号

3、这里的AppRegistry是注册APP的意思，只需要在入口出定义一次即可。

下面的组件r1,r2是我们的页面组件。相当于显示页面。

4、路由则必须是固定的可是引入。screen:前缀+Screen

路由必须是const定义的，类似于常量的那种

在r1.js文件中可以通过const直接使用。

5、引入界面

import LoginScreen from './LoginScreen';

这段代码的意思是引入登录的路由，相当于引入子界面。

在react native中，一级页面（首页等）必须在入口文件处定义，二级三级页面则在一级页面的文件

中来定义。就比如此处的LoginScreen.

6、组件TabNavigator:

这个组件相当于导航栏。在react native中，引入组件都需要去网上下载，一般都是通过npm来下载。

具体可以参考：http://blog.csdn.net/ljfphp/article/details/77683385 我的这篇博客。一般来说常用的组件

都是可以下载的。

end

这篇相当于简单的说了一下目录结构和入口文件等。大致了解react native的开发流程。当然，往后还得

自己写具体的逻辑啊，还要写样式啊之类的。写完之后还要测试，打包之类的，这些往后再补充吧，夜深了，睡觉。