問題

分別打開兩個詳情頁面，復(fù)制其中一個到另一個的地址欄中輸入url，按回車鍵，頁面卻沒有刷新，怎么回事？

思考

由于vue項目采用hash模式，詳情頁面采用同一組件，vue官方文檔這樣解釋：
提醒一下，當使用路由參數(shù)時，例如從 /user/foo 導(dǎo)航
到 /user/bar，原來的組件實例會被復(fù)用。因為兩個路由都渲染同個組件，比起銷毀再創(chuàng)建，復(fù)用則顯得更加高效。不過，這也意味著組件的生命周期鉤子不會再被調(diào)用。

復(fù)用組件時，想對路由參數(shù)的變化作出響應(yīng)的話，你可以簡單地 watch (監(jiān)測變化) $route 對象：

const User = {
  template: '...',
  watch: {
    '$route' (to, from) {
      // 對路由變化作出響應(yīng)...
    }
  }
}

或者使用 2.2 中引入的 beforeRouteUpdate 導(dǎo)航守衛(wèi)：

const User = {
  template: '...',
  beforeRouteUpdate (to, from, next) {
    // react to route changes...
    // don't forget to call next()
  }
}

最快解決方案

在父組件的 router-view 中加一個 key，例如：

<router-view :key="$route.fullPath" />