vue-router4路由解析
1、与router3相比的变化
1.1、不再一次性导入，而是按需导入
1.2、创建路由实例的方式修改为了 createRouter
1.3、路由模式设置由mode改为了history
history模式使用 createWebHistory()
hash模式使用 createWebHashHistory()
参数：
代表所访问路径的前缀
默认给出的import.meta.env.BASE_URL意味着导入了vite.config.js中的base项所给的地址
2、页面切换方式
2.1、template中
可以直接通过$router.push('路由路径')进行跳转
2.2、script中
注：在script中，不可以再通过this.$router来获取路由方法，需要通过方法来获取
2.2.1、useRouter()
需要先从vue-router中导入，用于获取路由对象
2.2.2、useRoute()
需要先从vue-router中导入，用于获取路由信息
2.3、如：
<script setup>
import { useRoute, useRouter } from 'vue-router'
const Router = useRouter()
const Route = useRoute()
const index = () => {
Router.push('/主页')
console.log(Router)
console.log(Route)
}
</script>
<template>
<div class="app">APP</div>
<button @click="$router.push('/谷歌')">谷歌</button>
<button @click="index">主页</button>
</template>