【前端】vue2 頁面路由跳轉後不重新加載

前言

     小編最近在新搭建的vue2.0的框架中，發現頁面路由跳轉後，不會重新加載，遇到這個問題，小編想到了vue的生命週期中，有幾個鉤子方法可以使用，通過上網查詢瞭解，找到了可以使頁面路由跳轉後可以重新加載頁面的鉤子方法。

調用方法重新渲染頁面   

 一、使用activated()鉤子方法

<script>
export default {
  // ...
  activated: function() {
    this.getCase()
  }
}
</script>

二、原因

1.mounted()方法是掛載鉤子，如果使用mounted()鉤子方法，需要修改一個Vue的內置組件keep-alive，才能正常渲染DOM。

  檢查項目中，在路由跳轉需要進行攔截判斷的頁面中使用了keep-alive組件：

  <Content :style="{margin: '20px', background: '#fff', minHeight: '260px'}">
          <keep-alive>
            <router-view/>
          </keep-alive>
  </Content>

2.keep-alive 是Vue的內置組件，能在組件切換過程中將狀態保留在內存中，防止重複渲染DOM。

  關於keep-alive組件的具體內容，地址：https://cn.vuejs.org/v2/api/#activated 

小結

    通過這次的經歷，小編對於vue中的一些方法有了進一步的認識，多看vue官網，多瞭解一些常用的方法，對於項目開發會有很大的幫助。

                                                                          感謝您的訪問！