保留卸载时的反应组件状态

Question

在这里反应新手：我注意到卸载后组件状态被清除。有办法防止吗？使用redux吗？

Answer 1

正如您所说，在卸载组件时，您将无法访问状态。这就是因为组件的生命周期。

您可以做的是尝试保存在安装时和每次更新时实例化的组件的状态。

• 您可以使用存储并使用简单的javascript。
• 您可以在父级或另一个祖先实例中拥有状态。

• 您可以在Redux存储中保存状态。请注意，您的组件将以var的形式接收props，因此不会正确表示状态。

  您可以使用redux来管理状态和状态值。我向您推荐redux-devtools-extension以及与此相关的article。

Answer 2

您有很多选择。您可以使用状态管理工具，例如redux，context API等，也可以将回调传递给父组件并在childComponentWillUnmount上触发它，如下所示：< / p>

ParentComponent.jsx：

childComponentWillUnmount = (data) => {
 console.log('my data', data);
}

render(){
  return <div>
    <Child componentUnmountCallback={this.childComponentWillUnmount()}/>
  <div>
}
<div>

Child.jsx

...

componentWillUnmount() {
   this.props.childComponentWillUnmount(this.state);

}

...