如何检测到用户单击了mdl-layout__drawer之外的抽屉，因此抽屉已关闭？

Question

我希望收到有关MDL抽屉已关闭的信息，以便能够根据用户在抽屉中设置的某些选项重新加载主页。

这怎么办？

Answer 1

监听抽屉元素上的transitionend事件，然后检测抽屉是否具有is-visible类，以确定抽屉是否刚刚打开或关闭。例如：

const drawer = document.querySelector('.mdl-layout__drawer');
drawer.addEventListener('transitionend', (event) => {
  if (!drawer.classList.contains('is-visible')) {
    alert('closed');
  }
});