主要是方便自己记录,另外方便用Android理解React native
布局部分
1.weight:1
weight: {
flex: 1
}
2.center(gravity)
center: { //两个都要
justifyContent: 'center',
alignItems: 'center',
},
3.对齐方式
React Native 的布局(容器属性)
http://blog.csdn.net/liangzelei/article/details/53965417
4.orientation(线性布局)
horizontal: {
flexDirection: 'row'
},
vertical: {
flexDirection: 'column'
},
4.圆
roundCorner: {
width: 40, height: 40, borderRadius: 20 = 40/2
},
5.圆角
round: {
borderRadius: 5
},
6.点击事件
//TouchableOpacity或Touchable...
<TouchableOpacity onPressIn={this.click.bind(this)} >
<Text style={{ fontSize: 15, color: '#FFFFFF' }} >正在热销</Text>
</TouchableOpacity>
onPressIn={this.click.bind(this)} => view.setOnclickListener(listen l)
// 注意Android是View.setOnclickListener 而Rn是Touchable.event并非所有View都有点击事件
7.生命周期(下面的=并非是等于,而是相当于)
获取Bundle的值=*getDefaultProps*
onCreate=*getInitialState*
//该函数用于对组件的一些状态进行初始化。
//可以将控制组件状态的一些变量在这里初始化(通过this.state来获取值,通过this.setState来修改值)。
setContentView+layout=*render*
//render函数返回JSX或其他组件来构成DOM(注意:只能返回一个顶级元素)。
//在render函数中,只可以通过this.props和this.state来访问在之前的函数中初始化的数据。
ondraw(绘制结束后) =componentDidMount:
//在调用了render函数,组件加载成功并被成功渲染出来以后,所要执行的后续操作(如网络请求等加载数据的操作),一般会在这个函数中进行。因为UI已经被渲染出来了,所以放在这个函数中进行的请求操作,不会出现UI上的错误。
//注意:如果想要在主类中书写多个生命周期函数(getInitialState等),需要使用ES 5的语法,如果使用ES 6的语法会报错。
*componentWillUnmount* =onstop、ondestroy(内存泄漏)
//执行销毁阶段的情况有多种,如:当系统遇到错误而崩溃时;系统空间不足时;APP被用户推出时,等等等等。
//当遇到上述问题时,系统就会进入销毁阶段,这个阶段只有一个过程:componentWillUnmount,这个方法用来清空一些无用内容,如:点击事件的Listener等。
*componentWillReceiveProps* *shouldComponentUpdate* = EventBus,Parent调用子控件
//注意:销毁阶段是程序执行的出口,只要执行了销毁阶段,就表示程序已经自然或不自然的退出了。
*shouldComponentUpdate* = view.ifInvalid()(是否刷新,Android中没有这个Api)
*componentWillUpdate* = view.invalid() 刷新View
8.局部变量
//java
if(state){
int a = 1;
}
a=2 ...throw a找不到
//rn
if(state){
let a = 1;
}
a=2 ...throw a找不到