1. 程式人生 > 實用技巧 >vue keep-alive使用

vue keep-alive使用

app.vue檔案(路由切換檔案)
<keep-alive :include="pageArr"> <router-view></router-view> </keep-alive>

 data () {
    return {
      pageArr: [
        'sourceLists',   //要快取的路由名稱
        'manageList'     //要快取的路由名稱
 ], 
}
要快取的頁面檔案
//activated鉤子
activated(){ this.fetchData(); },
//路由離開當前要快取的頁面的操作
beforeRouteLeave(to,from,next){ //導航離開該元件的對應路由時呼叫 //可以訪問元件例項`this` if(to.path!=='/literature/pool/detail'){ //初始化篩選條件項 this.formInline.name=''; this.formInline.roleId=0; this.pageSize=10; this.pageNum=1; this.current=1; this.total=0; } next(); },