Javascript 单击关闭引导模式窗口上的react router dom链接

我需要通过点击链接关闭模式窗口。我的模态窗口：

export const ModalWrapper = (props) => {
  const { children, title, modalName } = props;
  return (
    <div
      className="modal fade"
      id={`modal-${modalName}`}
      tabIndex="-1"
      role="dialog"
      aria-labelledby="modal-label"
      aria-hidden="true"
      style={{ display: 'none' }}
    >
      <div className="modal-dialog modal">
        <div className="modal-content" style={{ overflow: 'hidden' }}>
          <div className="modal-header">
            { title }
            <button type="button" className="close" data-dismiss="modal" aria-hidden="true">×</button>

          </div>
          <div className="modal-body" style={{ maxHeight: '435', overflowY: 'auto' }}>
            <ul className="list-unstyled todo-list">
              {children}
            </ul>
          </div>
        </div>
      </div>
    </div>
  );
};

export const ModalWrapper=（道具）=>{
const{children，title，modalName}=props；
返回(
{title}
×

{儿童}

);
};

如何使用react路由器dom链接关闭窗口

它关闭窗口而不重定向：

<Link to="/registration" data-dismiss="modal" className="btn btn-default">Registration</Link>

注册

它会重定向，但窗口不会关闭：

<Link to="/registration" className="btn btn-default">Registration</Link>

注册

---

谢谢大家!

要实现您的目标，您可以：

• 使用第三方库（例如）
• 坚持本机代码

您可以在他们的网站上阅读有关React引导库的更多信息

如果希望避免额外的依赖关系，可以使用React的

ref

功能：并使用它来操作dom（例如，在单击链接时隐藏对话框或任何其他操作）。在这种情况下，只需将

ref

回调函数附加到对话框dom元素：

<div className="modal" ref={(input) => {this.input = input}}>
...

---

结论：此时无法使用clear React隐藏引导。使用React引导或使用util函数（就像我提供的一样）。

这几乎可以完美地工作：）-您必须从body标记中删除类“model open”。此类禁止在较长的页面上滚动。因此添加以下内容：const body=document.getElementsByTagName（“body”）[0]；body.classList.remove（“模态打开”）；然后它就100%起作用了，谢谢你的第一篇帖子！：）

const hideActiveModal = () => {
  const modal = document.getElementsByClassName('modal show')[0];
  const fade = document.getElementsByClassName('modal-backdrop show')[0];
  modal.className = modal.className.replace('show', '');
  fade.className = fade.className.replace('show', '');
};