demo如下

class Demo4StateLearn extends React.Component { constructor(props) { super(props); this.state = { a:11 }; this.a = this.state.a;//在创建该组件的时候就设置 this.a = 状态机.a } loadData(e) {//每次输入改变状态机 const value = e.target.value; this.setState({a:value}); } render() { return ( <div> <input type="text" onChange={(e)=>{this.loadData(e)}}/> <div>this.state.a:{this.state.a}</div> <div>this.a:{this.a}</div> </div>  ) } }

网页效果如下图：

所以我们在基于React开发的时候，应该避免使用这种开发方式；而常见的使用方式更多的是如下：

render() { const a = this.state.a;//在render函数中在取值，这样就可以避免以上问题；因为每次setState都会触发render的重新执行；所以也就重新指向了新的地址； return ( <div style={{margin:"20px"}}> <input type="text" onChange={(e)=>{this.loadData(e)}}/> <div>this.state.a:{this.state.a}</div> <div>this.a:{this.a}</div> </div>  ) }

本来是应该去查看REACT的源码的，但碍于目前尚无读其源码的能力，所以只能在此依据现象进行推导； 如不正确，望斧正；

----------------------------2018,1,22-----勘误-----------------------

再次读此文，真是一派胡言；

上面之所以不会变，是因为this.a赋值为一个 基本数据类型  当然不会跟着state的改变而改变！

希望下次写博客自己可以强大些，不要误人子弟，也对自己没有任何帮助