vue 路由使用

route router的区别？

• this.$router 表示VueRouter的实例（全局对象），所有页面都可以调用其push()，go()等方法
• this.$route 表示当前正在用于跳转的路由器对象，可以调用其name、path、query、params等属性

// 推出页面 this.$router.push('/home')

• 动态路由
• router.addRoute() 添加路由
• router.removeRoute() 删除路由

路由重定向、动态重定向

const router = new VueRouter({
    mode: 'history',
    routes: [
        { path: '/home', redirect: '/dashboard' },
        { path: '/dashboard', component: Dashboard },
        // 默认404、一定要放在最下面 因为先走上面的代码 如上代码没有匹配到 则渲染 * 号 进入404
        {
          path: '*',
          name: 'error',
          component: () => import('@layout/404'),
        },
    ]
})

// 动态重定向
const routes = [
  {
    // /search/screens -> /search?q=screens
    path: '/search/:searchText',
    redirect: to => {
      // 方法接收目标路由作为参数
      // return 重定向的字符串路径/路径对象
      return { path: '/search', query: { q: to.params.searchText } }
    },
  },
  {
    path: '/search',
    // ...
  },
]