尝试想象这里有两件事：
- 组件（COMPONENT）本身，以及
- 组件之外的东西（外部）：
组件内部的变化
您需要调用this.setState（），这将更新当前组件 内部 的状态，并随后触发此组件的更新（自动调用render（））
与外界的变化
这将触发该组件的props /
newProps进行更新，随后通过在组件内部调用this.setState（）来更新组件（componentWillReceiveProps是React的生命周期方法）
class MyComponent extends React.Component { // initially how the state is set to MyComponent constructor(props) { super(props); this.state = {name: this.props.name}; } // own method to be called inside MyComponent updateName(e) { const newName = e.target.value; if (this.state.name !== newName) { this.setState({name:newName}); } } // changes from the outside componentWillReceiveProps(nextProps) { const newName = nextProps.name; if (this.state.name !== newName) { this.setState({name:newName}); } } render() { return( <div> {this.state.name} <input type="text" onChange={this.updateName.bind(this)} value={this.state.name} /> </div> ) }}值得指出的是，this.setState（）会自动触发render（），而this.state.name =’Bob’不会触发render（）。
