MDC Web 组件：mdc-dialog 有时无法正确关闭

Question

我使用 MDC-Web 组件。我以编程方式打开和关闭对话框，但有时它不会关闭。我不知道我关闭对话框的方式是否正确。

closeDialog('dialog_gui');

function closeDialog(elementId){
    let dialog = new mdc.dialog.MDCDialog(document.getElementById(elementId));
    dialog.close();
}

Answer 1

每次关闭对话框时，您的函数都会创建 MDCDialog 的新实例。您应该将对话框实例存储在关闭函数之外：

const dialog = new mdc.dialog.MDCDialog(document.getElementById('dialog_gui'));

function closeDialog() {
  // some stuff
  dialog.close();
}

closeDialog();

此外，您可以关闭对话框，无需额外功能，只需使用 MDCDialog 的 close() 方法：

const dialog = new mdc.dialog.MDCDialog(document.getElementById('dialog_gui'));

dialog.close();

这里是 the Codepen example 对话框将在此处打开，然后在 3 秒后关闭。