React/React Native的 ES5 ES6 写法对照

  ES5 ES6
模块

var React = require("react-native);
var {
 Image,
 Text,
 View       
} = React;
 
import React, {
   Image,
   Text,
   View
  } from 'react-native';

 

导出
var AppComponent = React.createClass({...});

module.exports = AppCompoent;

// 引用模块
var AppComponent = require('./js/AppComponent.js');
 
export default class AppComponent extends React.Component{...}

// 引用模块
import AppComponent from './js/AppComponent.js';
 定义组件
var AppComp = React.createClass({
   render: function(){
        return (...)     
    } 
})
 
 
class AppComp extends React.Component {
    render() {
        return (...)
    }
}

 

 定义组件方法  
var AppComp = React.createClass({
componentWillMount:
function() {}, render: function() { return (...) } })

 

 
class AppComp extends React.Component {

    componentWillMount() {...}

    render() {
        return (...);
    }

}

 

 初始化STATE
var MyComponent = React.createClass({

    getInitialState: function() {

        return { ... : ...}

    }

}) 
 
class AppComponent extends React.Component {

    constructor(props) {

        super(props);

        this.state = {  ... : ... }

    }
}

posted on 2016-05-09 12:40  马铃豆  阅读(231)  评论(0编辑  收藏  举报

导航