《Vue.js项目实战开发（第二版）》课件2-3 主页导航栏路由设计.pptx

Vue前端框架开发福州职业技术学院主讲：王琳燕任务二“就业直通车”项目初始化

子任务三：主页导航栏路由设计

任务陈述《Vue前端框架开发》核心任务页面效果核心目标建立导航与页面组件之间的映射关系示例场景点击主页按钮，页面渲染对应内容预期效果点击导航图标，上方区域切换显示核心逻辑：路由映射实现页面动态渲染

任务实施

任务实施《Vue前端框架开发》步骤一：安装与配置Vue-router安装Vue-router依赖打开项目终端，在根目录下执行上述命令完成库的安装。在入口文件main.js挂载路由通过`app.use()`方法注入路由实例，使整个应用具备路由管理能力。npminsta