首页 文章

按下浏览器后退按钮时,如何防止Vuej滚动到页面顶部

提问于
浏览
2

按下后退按钮时Vuejs会自动滚动到页面顶部,这很奇怪,因为默认情况下,当您在SPA中更改路线或转到新页面时,窗口甚至不会滚动到顶部 . 您需要明确设置scrollBehaviour以滚动到顶部 . 那么当你按下后退按钮时,我们如何防止页面自动滚动到顶部 .

beforeRouteLeave (to, from, next) {
    alert('Are you sure you want to leave this page and lose unsaved changes')
    // Notice how the page automatically scrolls to the top here even if the user were to response 'No' in a dialog situation
}

下面是问题的代码笔https://codepen.io/anon/pen/bOGqVP

1 回答

  • 1

    浏览器后退按钮滚动到顶部由浏览器定义 . 显然,我们可以通过添加这行代码来禁用该行为

    window.history.scrollRestoration = "manual"
    

    添加此代码将告诉浏览器我们处理滚动 . 我只在你的codepen中测试它 . 需要在其他浏览器中测试

相关问题