首先，props与state是React组件的两种方法。

props，可以在组件中来获取this.props的属性。

varHelloreact=React.createClass({render:function(){return<h2>Hello{this.props.name}</h2>}});ReactDOM.render(<Helloreactname="BOOM"/>,document.getElementById('example2'));//HelloBOOM

2.state，获取的是更新后的数据，是通过用户的状态来更改state。

varHelloreact=React.createClass({getInitialState:function(){return{name:'BOOM'};},render:function(){return<h2>Hello{this.state.name}</h2>}});ReactDOM.render(<Helloreact/>,document.getElementById('example2'));//HelloBOOM

3.在这里，可以通过props获取组件的属性，然后用state动态的更新。

varHelloMe=React.createClass({getDefaultProps:function(){return{value:'props'};},getInitialState:function(){return{value:'state'};},handleChange:function(event){this.setState({value:event.target.value});},clickhandle:function(event){this.setState({value:""});},render:function(){varvalue=this.state.value;return<div><inputtype="text"value={value}onChange={this.handleChange}/><h2>Hi{this.props.value}{value}</h2><buttononClick={this.clickhandle}>清除{value}</button></div>;}});ReactDOM.render(<divstyle={myStyle}><HelloMe/></div>,document.getElementById('example1'));

所以言之，相对于静态的状态下使用props会更好一些，动态的数据就需要使用state，

而React中，是虚拟的DOM树，是遍历全局后对数据进行对比，然后运算使用最快的方法进行的渲染。