vue系列教程之微商城项目|导航栏与页面绑定

在第3节中完成了导航栏样式的编写，接下来就是将每个导航栏按钮与页面绑定，实现点击按钮页面跳转。

1）新建所有子页面,主页、分类、购物车、我的.

2)在子页面中分别添加页面名字，区分四个页面

3)在router/index.js 路由中注册子页面

router/index.js

4)在App.vue中添加

App.vue

5)为navBarItem组件添加点击事件

6)效果图

7）项目的基本架构就搭好了，接下来只需要在各个子页面 中完成内容编写即可。

本篇文章是该系列文章中的第五篇，讲述的是导航栏与页面绑定的相关操作步骤。下篇系列文章之顶部导航栏封装正在打造之中，敬请期待。

实习编辑：隆阳

稿件来源：深度学习与文旅应用实验室（DLETA）