- 在vivo U上创建一个名为
app router.ts
的路由器文件。 - 进行依赖安装,添加
vue-router
至package.json
文件,使用版本4.0.0
。 - 使用
npm install
命令安装项目依赖。 - 在
src/app
目录下配置路由器,使用vue-router的createRouter
和createWebHistory
。 - 创建路由数组
routes
并暴露出路由器。 - 在vue应用入口文件
main.ts
中导入自定义路由器appRouter
。 - 使用
vue
的use
函数应用路由器。 - 定义路由路径和组件映射,在
src/app
目录创建appRoutes.ts
文件。 - 创建和路由对应的组件,如
app home
和post index
。 - 每个组件路由使用
name
,path
和component
字段配置。 - 在路由文件中,将路由路径和组件导入并暴露。
- 使用
<router-view>
组件在应用中展示活动路由对应的组件。 - 使用
<router-link>
组件创建指向不同路由路径的链接。 - 在浏览器可预览访问不同路由地址对应的组件内容。