始终安装react-bootstrap模态

Question

使用react-bootsrap模态的当前实现，需要渲染模态并传递show道具，确定是否显示模态。
这意味着如果我构建一个包裹<Modal>的组件，它将从第一个渲染中安装，并且所有初始化逻辑都将启动，即使模式未显示。
有没有办法避免这种情况？

• 如果我尝试{this.state.showModal && <MyModal />}而不是使用模态show道具 - 我放弃动画并正确隐藏模态
• 目前我无法使用ReactRouter

Answer 1

不确定为什么你不能使用React Router，但你采用的一般方法是不要在componentWillMount中放置onShow / onHide逻辑，因为那不起作用。

相反，您可以使用transition lifecycle hooks或更多，只需在将show设置为true或false时运行初始化逻辑。

具体来说，如果你将模态包装为create <MyModal>，则保持相同的api，然后执行以下操作：

componentWillReceiveProps(nextProps) {
  if (nextProps.show && !this.props.show) {
     //opening
  else if (!nextProps.show && this.props.show) {
     // closing
  }
} 

添加评论：

如果您不喜欢这种方法，我建议改为包裹<Modal.Body>，然后将其插入模态，然后您的生命周期挂钩将按照您的预期行事，因为您要添加内容到show上挂载的模型部分。