Android转React native代码转换(持续更新,欢迎帮助修正...)

主要是方便自己记录,另外方便用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找不到

猜你喜欢

转载自blog.csdn.net/u011850446/article/details/77775805