1. 程式人生 > >vue路由跳轉資料不更新解決

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>

轉自:https://blog.csdn.net/z9061/article/details/82179988