Vue开发的大概方向

一般先在components文件夹弄一个NavBar导航栏，这个导航栏需要在App.vue的

这里改为router-link还不行，因为本身是没有路由的，所以router-link的:to{}是找不到路由名字的，这时就需要我们去router文件夹中的index.js中添加各种路由，这个routers = [] 作为中间人，连接着NavBar导航栏中的各个router-link，同时也连接着在views文件夹中的各个页面。

一端”导航栏”，和中间人routers已经弄完了，现在要在views文件夹中创建各种页面了，但是按页面分还是太细了，所以按模块分(一个模块可能会有相关的多个页面)，按模块的话，就可以在views文件夹中新建几个文件夹，有几个模块就创建几个文件夹，同时还需要一个error文件夹来存放不同的错误提示页面。

页面写好后，只要通过export default暴露出去，然后引入router的index.js文件中，再添加到routers中。从而可以在不整体刷新页面的前提下，点击导航栏，实现导航栏下方的区域局部刷新，连接到不同的页面。

整体流程：

先想需要的模块有几个，就现在views文件夹中创建多少个文件夹，同时每个模块都有一个小主页，那么根据命名，给每个文件夹都先来一个index小主页面。（记得将页面export default出来）

然后是在components文件夹中创建一个NavBar组件(实际还是vue文件)，并将其添加到App.vue中

接着，在router文件夹中的index.js文件中，引入暴露出来的页面，将在routers[]中，将路由path，与component连接，并为这个路由起一个name。

最后把导航栏中的链接，改为router-link，而router-link中的:to{name: }就是routers[]的对应路由的名称。

经过上述流程，就可以实现基本的页面框架了。

可以将每个页面都放到一个card(自适应)里，而这个card是公用的，所以我们可以给它取个名字叫：ContentBase.vue，并将其放到components文件夹中，这样我们在每个页面都可以先使用到这个card组件，然后再在card里面写页面内容。

这样做的好处有很多，一个是公用组件，另一个是可以通过操纵ContentBase.vue实现整个页面的移动和布局