2. 请简述Vue-Router路由的作用和使用步骤

Vue Router是一个基于HTML5 History API和Hashbang模式的客户端-side routing库，主要用于在Vue应用程序中实现页面间的导航。它的作用包括：

1. **组织结构**：将复杂的网站划分为可独立管理和切换的模块，每个模块对应一个路由。
2. **URL管理**：为每个路由分配一个唯一的URL，提供更好的用户体验和SEO优化。
3. **视图切换**：当路由改变时，自动切换到相应的视图区域（由组件渲染），保持状态一致。

使用步骤大致如下：

1. **安装与引入**：首先在项目中安装Vue Router，然后在main.js或入口文件中导入并配置它。

import { createRouter, createWebHistory } from 'vue-router';
// 或者使用Hash模式
import Router from 'vue-router';

2. **定义路由**：创建一个或多个路由对象，包含路径（path）、组件（component）以及可选的额外选项，如meta信息等。

const routes = [
  { path: '/home', component: Home },
  { path: '/about', component: About }
];

3. **初始化路由器**：创建一个实例，并指定mode（history、hash等）和routes数组。

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL), // 使用浏览器History API
  routes
});

4. **挂载路由器**：在Vue实例的生命周期钩子里挂载router，通常是`beforeCreate`或`created`阶段。

new Vue({ router }).$mount('#app');

5. **导航与守卫**：使用`router.push`, `router.replace`, 或者`<router-link>`标签进行导航；可以设置导航守卫（ beforeEach, afterEach, beforeEnter, afterEnter, etc.）来控制路由切换流程。