如何使vue2路由后退不刷新？（代码设置）

如何使vue2路由后退不刷新？（代码设置）

1. 设置路由为两种情况，路由meta.keepAlive为true/false,true则运行缓存路由组件，false则重新加载路由组件
 
    
        
    



    

2. 给路由配置设置meta参数

// routes 配置
export default [
  {
    path: '/',
    name: 'home',
    component: Home,
    meta: {
      keepAlive: true // 需要被缓存
    }
  }, {
    path: '/:id',
    name: 'edit',
    component: Edit,
    meta: {
      keepAlive: false // 不需要被缓存
    }
  }
]

3. 在组件内设置路由是否重新加载

export default {
    data() {
        return {};
    },
    methods: {},
    beforeRouteLeave(to, from, next) {
         // 设置下一个路由的 meta
        to.meta.keepAlive = true;  // 让 A 缓存，即不刷新
        next();
    }
};