如何在路线更改时关闭覆盖元素。覆盖层是通用组件，因此即使在路线更改后它也保持打开状态

Question

问题是由于跨多个页面重用相同的组件实例造成的。

尝试设置一个调度操作以在每次页面加载时关闭。但解决方案实施起来太耗时了

Answer 1

您可以使用

popstate

事件检测路线变化：

window.addEventListener('popstate', () => {
    closeOverlay();
});

设置监听器后调用

closeOverlay()

来处理初始负载。

要使用

pushState

进行自定义导航，请在以下位置之后立即调用

closeOverlay()

：

history.pushState(null, '', url);
closeOverlay();

对于像基于哈希的路由这样的边缘情况，还设置一个侦听器：

window.addEventListener('hashchange', closeOverlay);