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();
  },




 

posted @ 2020-12-21 11:30  潇潇-lucky  阅读(91)  评论(0编辑  收藏  举报