使用React设置Semantic UI Modal生命周期的正确方法

Question

问题

设置Semantic UI模式的正确生活方式，并将其与容器组件集成。

容器

我的容器组件名为NewsList，它包含一个按钮，用于激活语义UI模式以确认您确实要删除此新闻。 模态在onNewsDelete(news)中创建并存储在容器的state中。渲染方法检查this.state.modal是否存在，如果存在，则渲染它。

模态

第一步 - 显示模态，效果非常好。所有工作都在componentDidMount方法内完成，如下所示：

componentDidMount() {
    $(this.refs.modal)
      .modal({
        onHidden: this.props.onCancel
      })
      .modal('show')
  }

显示模态，并将父方法的回调存储为onHidden事件回调，以在模式被解除后销毁模式。

返回容器

取消模态后，将调用父级的回调（我们通过onCancel prop传递它）。我们将容器的状态设置为{ modal: null }以便销毁组件。而且有一个错误：

NotFoundError: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

我不确定是否会发生这种情况，因为我遗漏了某些内容，或者我根本不理解组件的生命周期。