先来说说两个API 的作用
useRouter()
: 返回的是项目中的路由实例的对象
可以通过这个实例对象进行路由的逻辑跳转
useRoute()
: 返回的是当前的路由对象
,
可以在当前路由对象中获取到路由名称、路由参数、路由路径等玩完整的路由信息。
写个案例看一下具体是什么
项目描述 :
1、router.ts 文件中配置并导出了 router路由实例的对象;
2、main.ts 文件中 使用了 router 路由实例,这样 整个项目中就可以进行路由跳转了;
3、App.vue 作为根组件,使用 <router-view> 标签 展示路由的目标组件;
4、componentA.vue 和 componentB.vue 是两个普通的组件;
5、通过 在组件中 引入两个API 来探究这两个API 到底是什么。
项目的目录解构如下 :
projectName
| -- index.html
| -- src
| -- App.vue
| -- main.ts
| -- router.ts
| -- componentA.vue
| -- componentB.vue