Skip to content

编程式路由导航

作用

不借助<router-link>实现跳转,让路由跳转更加灵活

具体编码

js
this.$router.push({
  //$router的两个API
  name: "xingqing",
  params: {
    id: xxx,
    title: xxx,
  },
});
this.$router.replace({
  name: "xingqing",
  params: {
    id: xxx,
    title: xxx,
  },
});
this.$router.forward(); //前进
this.$router.back(); //后退
this.$router.go(); //前进也可,后退也可

缓存路由组件

作用

让不展示的组件保持挂载,不被销毁

具体编码:

vue
<keep-alive include="News">//缓存一个路由组件
     <router-view></router-view>
</keep-alive>

缓存多个路由组件

vue
<keep-alive include="['News','Message']">
    <router-view></router-view>
</keep-alive>