API

1.style样式的属性代表的含义：

flex，设置成1就是填充父窗体，设置成其他就是所占的比例大小（也就是android中的权重）

flexdirection：‘row’代表view里边的子view要在一行或一列显示，默认是垂直显示。

flexwarp：空间不足会换行

2.ios 与android进行两端适配的错操作：

将index.ios.js与index.android.js文件里的代码抽取到一个Main.js文件里，将Main.js文件不需要进行注册启动项。应该分别在iOS与android的文件里分别设置启动项。在iOS与android的文件里将我们的Main.js文件引入，然后渲染我们的Main组件。

3.flexbox是flexiblebox的缩写，弹性盒子布局，主流浏览器都支持。他是有伸缩性容器与伸缩性项目（item）组成。

4.仿去哪网的条目

做分割线，采取的原理与思想是，设置view边框设备像素的一份或几分，给取到的像素点添加颜色，这样看上去就有分割线了，获取设备像素密度：pixelRatio.get()。可以根据像素密度判断当前式环境是什么。给view写多个样式可以用[],包裹起来，如果是内切式，用{}.例如：style={[styles.norow,styles.mytext,styles.linecenter,styles.mytextstyle],{我是内嵌样式}}。

5.设置居中的常用的属性

justifyContent:'center',//项目居中对其，也可以设置为，flex-start，flex-end，center，space- between，space-around

alignItems:'center',//对其方式为居中，也可以设置为适应父窗体（容器）stretch

6.设置组建（view）边框宽度

borderLeftWidth:1/PixelRatio.get(),

borderRightWidth:1/PixelRatio.get(),

borderBottomWidth:1/PixelRatio.get(),

borderTopWidth:1/PixeRatio.get(),

7.公共头部的抽取

将页面公共的部分抽取出来，然后以module的形式导出，在其他页面以组建的形式进行引用。

8.抽取公共类

在开放中会出现好多页面处理的逻辑都是一样的，我们将其抽取到一个类里边，然后导出，

例如在处理返回按键的时候，这个逻辑是公用的我们要将他抽取。

9.页面跳转的处理方案：

1.在函数入口的组件使用 Navigator组件。

在Navigator组件里设置三个属性，分别是

initialRoute：指定了默认的页面，也就是启动app之后会看到界面的第一屏。 需要填写两个参数: name 跟 component。

configureScene：页面之间跳转时候的动画和手势，具体请看官方文档

renderScene：导航栏可以根据指定的路由来渲染场景，调用的参数是路由和导航器

2.页面跳转处理

/**

* 为什么这里可以取得 props.navigator?请看上面的App.js:

* <Component {...route.params} navigator={navigator} />

* 这里传递了navigator作为props

*/

const { navigator } = this.props;

if(navigator) {

navigator.push({

name: 'SecondPage',

component: SecondPage,

})

}

10image组件

resizeMode：图片的使用模式 cover，contain，stretch

source：图片的引用地址

网络图片：source={uri:'http://.png'}

本地图片：source={require('./baidulog.png')}

11.Picker组件和箭头函数

本组件可以在iOS和Android上渲染原生的选择器（Picker）

<Picker selectedValue={this.state.lanage}

onValueChange={lang => this.setState({lanage: lang})}

mode="dialog"

style={{color:'#f00'}}>

<Picker.Item label="Java" value="java" />

<Picker.Item label="android" value="android" />

<Picker.Item label="ios" value="ios" />

<Picker.Item label="html5" value="html5" />

<Picker.Item label="vue" value="vue" />

<Picker.Item label="php" value="php" />

</Picker>

12:DrawerLayoutAndroid组件(封装了平台DrawerLayout（仅限安卓平台）的React组件)

drawerPosition：DrawerLayoutAndroid.positions.Right 左右 默认左

drawerWidth：指定抽屉的宽度，也就是从屏幕边缘拖进的视图的宽度

onDrawerClose

onDrawerOpen

onDrawerSlide：每当导航视图（抽屉）产生交互的时候调用此回调函数

onDrawerStateChanged：idle（空闲） dragging（拖拽中） settling（停靠中）

renderNavigationView：渲染一个可以从屏幕一边拖入的导航视图

drawerLockMode：设置抽屉的锁定模式 有三种模式：

1.unlocked (默认值)，意味着此时抽屉可以响应打开和关闭的手势操作

2.locked-closed，意味着此时抽屉将保持关闭，不可用手势打开。

3.locked-open，意味着此时抽屉将保持打开，不可用手势关闭。

无论抽屉处于那种状态，都仍然可以调用openDrawer/closeDrawer这两个方法打开和关闭

13.ViewPagerAndroid组件

一个允许在子视图之间左右翻页的容器。每一个ViewPagerAndroid的子容器会被视一个单独的页，并且会被拉伸填满ViewPagerAndroid

注意所有的子视图都必须是纯View，而不能是自定义的复合容器

属性：

1.initialPage 初始选中页的下标

2.onPageScroll 当在页间切换时（不论是由于动画还是由于用户在页间滑动/拖拽）执 行回调参数中的event.nativeEvent对象会包含如下数据：position offset 一个在[0,1)（大于等于0，小于1）之间的范围，代表当前页面切换的状态

3.onPageScrollStateChanged： idle ，dragging ，settling

4.onPageSelected 这个回调会在页面切换完成后（当用户在页面间滑动）调用回调参数中的event.nativeEvent对象会包含如下的字段： position