vue route和router的区别，用例子说明

Vue Router 是 Vue.js 官方提供的路由管理器，它和 Vue.js 的核心深度集成，可以方便地和 Vue.js 一起使用，用于构建单页应用程序（SPA）。而 Vue Route 只是一个第三方库，也是用于构建单页应用程序（SPA）的路由管理器。

Vue Router 和 Vue Route 的区别主要在于两个方面：

1. 功能方面：Vue Router 比 Vue Route 更加强大，它提供了更多的功能和更好的性能。例如，Vue Router 支持路由懒加载和路由守卫，可以更加细粒度地控制路由跳转和组件加载等。

2. 使用方面：Vue Router 和 Vue Route 的使用方式也有所不同。Vue Router是由 Vue.js 官方提供的，因此在 Vue.js 中使用 Vue Router 更加方便和自然。而 Vue Route 则需要手动导入和配置，使用起来稍微麻烦一些。

下面是一个使用 Vue Router 的示例代码：

import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'home',
    component: () => import('@/views/Home.vue')
  },
  {
    path: '/about',
    name: 'about',
    component: () => import('@/views/About.vue')
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router

在上面的代码中，我们首先通过 `import` 导入了 Vue.js 和 Vue Router，并使用 `Vue.use(VueRouter)` 注册了 Vue Router。然后定义了两个路由：`/` 和 `/about`，分别对应 Home.vue 和 About.vue 组件。最后创建了一个 VueRouter 实例并导出。这样就完成了 Vue Router 的配置。

使用 Vue Router 跳转路由的方式也非常简单，只需要使用 `this.$router.push()` 方法即可，例如：

this.$router.push('/about')