关闭侧面菜单后单击

Question

我正在构建一个Angular应用程序，并在popstate上关闭菜单遇到了一些麻烦。 当侧面菜单打开并且用户单击其移动设备上的后退按钮时，我希望菜单关闭菜单，为此，我使用诸如此类的弹出状态

@HostListener('window:popstate', ['$event'])
  onPopState(event) {
    if (this.isMenuOpened) {
      this.toggleSidebar();
    }
      return ;
  }

Im的问题是后退动作也起作用，因此菜单关闭，但后退动作也发生。 我不能使用history.go(1)因为它会使页面再次加载，并且我不希望这种行为。

你有什么主意吗？

Answer 1

根据规范， Popstate无法取消。 但是，您可以尝试执行此操作

@HostListener('window:popstate', ['$event'])
onPopState(event) {
    if (this.isMenuOpened) {
        event.preventDefault();
        history.go(1); // re-changes the url to what it should be
        this.toggleSidebar();
    }
    return ;
}

Answer 2

尝试这个 -

 $(window).on( "popstate", function(event){
          if( !event.originalEvent.state ){
          history.pushState( "nohb", null, "" );
          return;
          }
      });

代替history.go（1）使用window.history.forward（）

window.history.forward（）此函数在第一页中使用浏览器的历史记录，并强制其向前浏览而不是转到上一页。 因此，每次用户单击“后退”按钮，都会导致浏览器向前导航或推动用户并显示同一页面。