以编程方式关闭模式（react-materialize）答案

【问题标题】：Closing the modal programmatically (react-materialize)以编程方式关闭模式（react-materialize）
【发布时间】：2020-03-06 10:49:30
【问题描述】：

我不知道如何以编程方式关闭模式（例如，用户登录后的登录模式）。

看起来像这样：

<Modal
  actions={[
    <Button flat modal="close" node="button" waves="green">
      Close
    </Button>
  ]}
  bottomSheet={false}
  fixedFooter={false}
  header="Log in"
  id="modal-login"
  options={{
    dismissible: true,
    endingTop: "10%",
    inDuration: 250,
    onCloseEnd: null,
    onCloseStart: null,
    onOpenEnd: null,
    onOpenStart: null,
    opacity: 0.5,
    outDuration: 250,
    preventScrolling: true,
    startingTop: "4%"
  }}
>
  <form onSubmit={e => /* log in user */}>
    <input type="email"/>
    <input type="password"/>
    <button>Log in</button>
  </form>
</Modal>

【问题讨论】：

标签： reactjs modal-dialog materialize

【解决方案1】：

使用 open 属性以编程方式打开或关闭模态

<Modal
  open={isModalOpen}
  ...
/>

参考：https://react-materialize.github.io/react-materialize/?path=/story/javascript-modal--default

【讨论】：

谢谢！这有效，但只有在我从用于关闭模式的按钮中删除 modal="close" 并将其替换为 onClick={() => setIsModalOpen(false)} 之后。
是的。使用这种方法，您必须通过操纵状态变量来 100% 控制模态的打开和关闭。很高兴它成功了。