回顾历史时的classlist.remove

Question

我用javascript做了一个小页面转换。

当用户单击某个链接时，黑色div将获得类“幻灯片”，该类将触发从0到1的不透明度动画。

然后，它触发到下一页的链接，其中黑色div从不透明度1动画到0。这个很好用。

但是当我回顾历史时，div仍然有一个类“幻灯片”，所以我只看到一个黑色的矩形。

当我在classList.remove("slide")中放置一个setTimeout时，这个问题就消失了，但是当切换到另一个页面时，我看到了一个毫秒的页面。

有人知道我如何解决这个问题吗？

for (let i = 0; i < link.length; i++) {
    link[i].addEventListener("click", (e) => {
        e.preventDefault();
        transition.classList.add("slide");
        setTimeout(() => {
            window.location = link[i].href;
        }, 450);
    });
} 

Answer 1

解决方案: performance.navigation.type，如第二个答案中提到的：How to force reloading a page when using browser back button?

if(performance.navigation.type == 2){
   location.reload(true);
}