vue封装导航栏

---

前言

利用vue封装自己的导航栏

---

我的组件需要完成的结果如下：

一、项目结构

首先我们利用vue-cli脚手架工具创建了我们的vue项目，这时候我们会发现他已经将基本的项目结构划分完成了，这个时候我们需要根据自己的实际项目需求完善自己的项目结构。(创建vue项目见前博文)。既然我们要封装一个导航栏那么我们应该将这个组件放在什么地方呢？为了方便管理，我们又该如何设置项目结构呢？根据以上问题我们可以在components下创建一个common文件夹，用来存储抽离出来的组件。然后再其下创建我们的navbar文件夹，并且创建NavBar.vue组件

二、明确组件特征

既然我们要封装一个组件，那么在封装组件之前我们应该知道我们要封装的组件具有怎样的特征，在这我们要封装一个导航栏，那么导航栏有什么特征？