Vue路由跳轉到新頁面時 預設在頁面最底部 而不是最頂部 的解決

今天碰到一個問題   vue路由跳轉到新的頁面時會直接顯示頁面最底部  正常情況下是顯示的最頂部的  而且好多路由中不是全部都是這種情況  折騰好長時間也沒解決  最後在網上找到瞭解決辦法

其實原理很簡單  就是在頁面載入完畢後  把滾動條的距離設置為（0，0） 就解決了  

mounted () 
    this.$router.afterEach((to, from, next) => {
        window.scrollTo(0, 0)
    })
}

很不理解的就是為什麼會出現這種情況呢？