Question

是否可以卸载React组件的父级而不卸载子级？有什么工作来实现这个结果？当然必须有一些（可能是hacky）方法来做到这一点。

示例

当这个：

<Parent>
  <Child/>
</Parent>

对此的更改：

<Child/>

我希望调用Parent的生命周期方法componentWillUnmount，而不调用Child的生命周期方法componentWillUnmount。

我认识到这可能是不可能的，但是想知道是否有人有这个问题的创造性解决方案。

更新

这是我的具体用例（希望我做得足够好解释这个）：

我有一个更高阶的组件，它没有引入任何新的dom元素，但实际上只是为子组件引入了一些新的上下文。子组件呈现的略有不同，具体取决于是否存在此上下文。不幸的是，当我删除并添加父项时，会创建子项的新实例并卸载/重新安装。这个卸载和重新安装的唯一问题是子元素执行一些dom测量来决定是否为它的某些元素显示水平滚动条和溢出菜单。卸下/重新安装时，此菜单会有一个难看的闪烁。

Answer 1

您可以处理渲染逻辑。例如，在渲染函数中：

  if (showParent) {
    return (
    <Parent>
        <Child/>
    </Parent>);
  } else{
    return <Child/>;
  }

然后，只要布尔showParent改变组件呈现的方式不同。

调用此render（）的超父对象应该存储状态，以便更新它们并保留子节点（以及父节点，以防你想重新打开它）。

因此它也应该包含孩子的状态，以便保留它。换句话说：将模型分层移动到超级父级。

在不卸载子项的情况下卸载React Parent

1 个答案: