vue缓存当前路由(在输入框中输入信息后,跳转其他路由再回来,仍可看到刚刚输入的内容等)

缓存路由页面的当前状态;

 
 <transition name="fade" mode="out-in">
    <keep-alive>
       <router-view v-if="$route.meta.keepAlive"></router-view>
    </keep-alive>  
 </transition>
 <router-view v-if="!$route.meta.keepAlive"></router-view>
 

在router ==> index.js中添加

meta: {
  keepAlive: true
}
注:将transition动态效果添加在外层;v-if="!$route.meta.keepAlive" ,显示 的是不缓存的路由;
有静态路由和动态路由混合时,需要加此判断;
 
posted @ 2019-11-11 21:27  益码凭川  阅读(642)  评论(0编辑  收藏  举报