12.基于vue-router的案例
案例分析
用到的路由技术要点:
- 路由的基础用法
- 嵌套路由
- 路由重定向
- 路由传参
- 编程式导航
根据项目的整体布局划分好组件结构,通过路由导航控制组件的显示
1.抽离并渲染 App根组件
2.将左侧菜 单改造为路由链接
3.创建左侧菜 单对应的路由组件
4.在右侧主体区域添加路由占位符
5.添加子路由规则
6.通过路由重定向默认渲染用户组件
7.渲染用户列表数据
8.编程式导航跳转到用户详情页
9. 实现后退功能
用到的路由技术要点:
根据项目的整体布局划分好组件结构,通过路由导航控制组件的显示
1.抽离并渲染 App根组件
2.将左侧菜 单改造为路由链接
3.创建左侧菜 单对应的路由组件
4.在右侧主体区域添加路由占位符
5.添加子路由规则
6.通过路由重定向默认渲染用户组件
7.渲染用户列表数据
8.编程式导航跳转到用户详情页
9. 实现后退功能