如何在ReactNative中使用ES6新语法
展开全部
1引入与导式同
//ES5
var React = require("react");
//ES6
import React, { Component, PropTypes } from 'react
?0?2 ?0?2导入: ES5使用require导入ES6使用import
//ES5
module.exports = Test;
?0?2
//ES6
export default Test;
?0?2
2创建组件式同
//ES5
var Test = React.createClass( {
..........
} );
//ES6
class Test extends Component {
..........
}
?0?2ES5使用React.createClass() ?0?2括号面需要括号
?0?2ES6定义组件继承自React框架Component(需要导入)需要括号
?0?2
3初始化组件属性式及限制组件属性类型式同
//ES5
var Test = React.createClass({
getDefaultProps: function() {
return {
myPro: 10
};
},
propTypes: {
myPro: React.PropTypes.number. isRequired
}
});
//ES6
class Test extends Component {
static defaultProps = {
myPro: 10
};
static propTypes = {
myPro: React.PropTypes.number. isRequired
};
}
?0?2 ES5通使用propTypes员getDefaultProps实现
?0?2 ES6统使用static员(用ES5)
?0?2
4初始化同
//ES5
getInitialState: function() {
...........
return {
myState: 10
}
}
//ES6
state = {
myState: 10
}
?0?2 ?0?2ES6直接使用state初始化能进行些其运算所经:
constructor(props){
super(props);
this.state = {
myState: 10
};
}
?0?2
5ES5每都需要加逗号且需要用 render: function()写ES6需要加逗号直接用render()直接名字加括号形参
//ES5
var React = require("react");
//ES6
import React, { Component, PropTypes } from 'react
?0?2 ?0?2导入: ES5使用require导入ES6使用import
//ES5
module.exports = Test;
?0?2
//ES6
export default Test;
?0?2
2创建组件式同
//ES5
var Test = React.createClass( {
..........
} );
//ES6
class Test extends Component {
..........
}
?0?2ES5使用React.createClass() ?0?2括号面需要括号
?0?2ES6定义组件继承自React框架Component(需要导入)需要括号
?0?2
3初始化组件属性式及限制组件属性类型式同
//ES5
var Test = React.createClass({
getDefaultProps: function() {
return {
myPro: 10
};
},
propTypes: {
myPro: React.PropTypes.number. isRequired
}
});
//ES6
class Test extends Component {
static defaultProps = {
myPro: 10
};
static propTypes = {
myPro: React.PropTypes.number. isRequired
};
}
?0?2 ES5通使用propTypes员getDefaultProps实现
?0?2 ES6统使用static员(用ES5)
?0?2
4初始化同
//ES5
getInitialState: function() {
...........
return {
myState: 10
}
}
//ES6
state = {
myState: 10
}
?0?2 ?0?2ES6直接使用state初始化能进行些其运算所经:
constructor(props){
super(props);
this.state = {
myState: 10
};
}
?0?2
5ES5每都需要加逗号且需要用 render: function()写ES6需要加逗号直接用render()直接名字加括号形参
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询