您好,登錄后才能下訂單哦!
小編給大家分享一下如何解決Vue 路由切換時頁面內容沒有重新加載的問題,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
第二次進入頁面,頁面路由參數已經改變,但是頁面內容不會刷新。
問題原因:在組件mounted鉤子中調用的刷新頁面內容,但測試發現這個鉤子沒有被調用。后來發現App.vue中使用了<keep-alive>:
<template> <div id="app"> <keep-alive> <router-view></router-view> </keep-alive> </div> </template>
keep-alive是Vue的內置組件,能在組件切換過程中將狀態保留在內存中,防止重復渲染DOM。這就是問題所在了。
解決辦法:
使用Vue組件切換過程鉤子activated(keep-alive組件激活時調用),而不是掛載鉤子mounted:
<script> export default { // ... activated: function() { this.getCase() } } </script>
關于keep-alive組件的鉤子:https://cn.vuejs.org/v2/api/#activated
以上是“如何解決Vue 路由切換時頁面內容沒有重新加載的問題”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。