vue返回上一页并不刷新

vue返回上一页并不刷新

1.首先全局页面添加keep-alive


    <keep-alive >
        <router-view  v-if="$route.meta.keepAlive"></router-view>
      </keep-alive>
      <router-view  v-if="!$route.meta.keepAlive"></router-view>

2.判断那些路径需要返回不刷新,如果不要判断这部分可以不用写


router.beforeEach(async(to, from, next) => {
    if (to.path === '/login') {
      next({ path: '/' })
    }else{
      // to要进入的目标路由,到哪去Erom离开的路由,哪来的savePosition内容
      
        //判断是否需要缓存
        if(to.path == 'text' && from.path =='/orderInfo'){
          to.meta.keepAlive = true;  // 让 列表页 缓存,即不刷新
        }else {
          to.meta.keepAlive = false;  // 让 列表页 即不缓存,刷新
        }
        next()
      }
})

3.在路由router.js设置keepAlive:true


{
      path:'text',
      name:'全部订单',
      component:()=>import('@/views/List/index'),
      meta:{keepAlive:true}  
    },
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐