1、使用的是vue-cli 3.0起的

2、文件目录结构

3、整体的骨架是根据element 文档里头的Container容器布局来的(复制粘贴,喜欢什么色儿就改)

aside这个 部分需要注意的是这边的变化是根据路由的增加而增加。根据路由里面meta属性(路由部分)这里需要注意的是每一个顶级路由引入的都是layout.vue这个布局  在 container 里面写内容需要写一个router-view接受(下面再说)

这个地方圈错了  ,到时候打印一下就知道了。很简单的

圈起来的 的就是书写内容的地方(上面的说的加 router-view)

header部分加了element的面包屑也是根据路由中的meta来的  上面 有地方圈错了

大概的骨架就搭好了

vue+Element 后台管理骨架的更多相关文章

  1. Vue + ElementUI 后台管理模板推荐

    最近学习和项目都用到了Vue和ElementUI,自己不是专业前端,搞这些UI上的东西还是有些难度,这里推荐两个Vue + ElementUI后台管理模板 vue-element-admin vue- ...

  2. Vue Admin - 基于 Vue & Bulma 后台管理面板

    Vue Admin 是一个基于 Vue 2.0 & Bulma 0.3 的后台管理面板(管理系统),相当于是 Vue 版本的 Bootstrap 管理系统,提供了一组通用的后台界面 UI 和组 ...

  3. 手摸手,带你用vue实现后台管理权限系统及顶栏三级菜单显示

    手摸手,带你用vue实现后台管理权限系统及顶栏三级菜单显示 效果演示地址 项目demo展示 重要功能总结 权限功能的实现 权限路由思路: 根据用户登录的roles信息与路由中配置的roles信息进行比 ...

  4. 换个思维,boot结合vue做后台管理

    可以添加,可以删除.动态的添加数据. 不用操作dom,只要操作json数据即可. <form class="form-horizontal addForm" id=" ...

  5. 项目:Vue+node+后台管理项目小结

    序:本文主要分两块说:项目机制,具体用到的知识块. 1. 项目机制 项目的原型以vue-cli为原型,进行项目的初步构建.项目以node.js服务和webpack打包机制为依托,将.vue文件打包为浏 ...

  6. vue搭建后台管理页面(点击左侧导航,切换右侧内容)

    home.vue页面 <template> <div style="background-color: #EBEBEB;min-height:900px"> ...

  7. Vue Admin 后台管理

    https://segmentfault.com/a/1190000009188689

  8. vue+elementui后台管理快捷代码片段

    Form <el-form labelPosition="right" labelWidth="10%" size="small" : ...

  9. 循序渐进VUE+Element 前端应用开发(16)--- 组织机构和角色管理模块的处理

    在前面随笔<循序渐进VUE+Element 前端应用开发(15)--- 用户管理模块的处理>中介绍了用户管理模块的内容,包括用户列表的展示,各种查看.编辑.新增对话框的界面处理和后台数据处 ...

随机推荐

  1. AS shortcuts

    stl => statelessstf => statefulalt+enter, select element => add pading or somethingselect c ...

  2. pandas-06 Series和Dataframe的排序操作

    pandas-06 Series和Dataframe的排序操作 对pandas中的Series和Dataframe进行排序,主要使用sort_values()和sort_index(). DataFr ...

  3. 尚学堂JAVA基础学习笔记

    目录 尚学堂JAVA基础学习笔记 写在前面 第1章 JAVA入门 第2章 数据类型和运算符 第3章 控制语句 第4章 Java面向对象基础 1. 面向对象基础 2. 面向对象的内存分析 3. 构造方法 ...

  4. Linux 应用程序的安装和管理

    在Linux中,有三种安装软件的方式,分别是RPM包安装.YUM源安装.源代码编译安装. 常见应用程序目录结构 类型 路径 普通用户可执行文件 /usr/bin 管理员可执行文件 /usr/sbin ...

  5. ElasticSearch(十一):Spring Data ElasticSearch 的使用(一)

    1.环境准备 我本地使用的环境为: 虚拟机版本:Centos 7.3 两台   IP 分别为:192.168.56.12, 192.168.56.13 Elasticsearch版本:6.4.0  ( ...

  6. Gerrit服务器权限管理

    Gerrit服务器权限管理 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.Gerrit权限概述 1>.对象 Gerrit识别单个或多个人员集合. Gerrit不允许使用单 ...

  7. X.509_2

    参考:你了解HTTPS,但你可能不了解X.509 地址:http://www.imooc.com/article/288067?block_id=tuijian_wz 参考:X.509证书的解析.验证 ...

  8. Andrew Ng机器学习 一: Linear Regression

    一:单变量线性回归(Linear regression with one variable) 背景:在某城市开办饭馆,我们有这样的数据集ex1data1.txt,第一列代表某个城市的人口,第二列代表在 ...

  9. Python 推送RabbitMQ

    username = 'xxxxxxxx' pwd = 'xxxxxxxx' user_pwd = pika.PlainCredentials(username, pwd) s_conn = pika ...

  10. springboot在idea的RunDashboard如何显示出来

    找到.idea文件下的workspace.xml,并找到RunDashboard 加入如下配置 <option name="configurationTypes"> & ...