React 状态提升

自组件通过props来接收父组件传递的信息,但是子组件不能更改props,子组件可以定义state,state可以通过setState修改。当子组件需要更改父组件传递的数据时,就用到了“状态提升”,我理解的“状态提升”就是父组件通过传入一个方法,子组件触发该方法。具体的代码格式类似于,在父组件中声明一个方法,比如 handleStateChange () {....},然后传入给子组件 <Child onStatechange={this.handleSrateChange} />。然后子组件的 this.props.onStatechange就是该方法。我们可以通过子组件中某个事件去出发父组件传递的方法。子组件的方法可以是:

handleChildClick(e) {  this.props.onStateChange(e.target.value)}

我在实际开发过程中就遇到过,比如我在组件A中定义了一个按钮,该按钮点击后会修改B组件中的值。因为A、B组件是相互独立的,所以就用到了状态的提升。归纳起来就是原来父组件传值给子组件,现在改为传方法给子组件去触发,这就是我理解的状态提升。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容