如何处理（销毁）引导程序 5 模态

Question

我在一个项目中使用 bootstrap 5。我正在构建一个在您单击按钮时打开的测验。测验显示在 bootstrap 5 模态组件中。

我的问题是，当您单击模式的关闭按钮然后重新启动它时，上一轮测验的数据仍然存在（仍然选中单选按钮）。我希望关闭按钮破坏模式并处理所有以前的数据。我已经尝试了几种方法（分别），如下所述：

myModal.dispose()
myModal.modal("dispose")
bootstrap.Modal.dispose();
bootstrap.Modal(bootstrap.modal.getInstance(quiz-modal)).dispose

Bootstrap 5 有一个名为 Modal 的类，其中有一个 dispose 方法，但我无法使用它。

模态的名称是myModal，它是一个bootstrap 5 模态。 quiz-modal 是对显示为模态的 html 元素的引用。

Answer 1

我找到了一个似乎可行的解决方案。

quizClose.addEventListener("click", () => {
  //reset the forms containing quiz questions
  for (let i = 0; i < totalQuestions.length; i++) {
    totalQuestions[i].reset();
  }
  let myModal = bootstrap.Modal.getInstance(
    document.querySelector(".quiz-modal")
  );
  //remove static backdrop
  myModal.setAttribute("data-bs-backdrop", "false");
  //destroy modal
  myModal.dispose();
});