javascript - MDC：单击浏览器的后退按钮时，drawer.open 未初始化

Question

我想用抽屉。我编写了基本代码，这样当用户单击导航按钮时，drawer.open 会被切换（即 true、false、true、false、...）。但是，如果用户通过单击抽屉菜单中的链接进入其他页面并通过单击浏览器的后退按钮返回，则drawer.open 为true，并且用户无法单击浏览器的导航按钮。

1. 用户打开页面：drawer.open=false。
2. 用户单击导航按钮：drawer.open=true。
3. 用户单击菜单中的链接：drawer.open=false在新页面中。
4. 用户单击浏览器的后退按钮并返回：drawer.open=true.

为什么drawer.open=true在4.？我该如何解决？

Answer 1

当用户单击浏览器的后退按钮时，重新加载页面以初始化 JavaScript 变量。

<script>
        window.onpageshow = function(event) {
            if (event.persisted) {
                 window.location.reload();
            }
        };
</script>