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. JUC - Monitor监控ThreadPoolExecutor

    JUC - Monitor监控ThreadPoolExecutor 一个自定义Monitor监控ThreadPoolExecutor的执行情况 TASK WokerTask class WorkerT ...

  2. Implement CGLIB in ABAP

    What is cglib?A Byte Code Generation Library which is high level API to generate and transform Java ...

  3. unity 实现技能释放

    要实现技能释放其实很简单,说白了就是在指定的位置Instantiate一个对应的例子特效.我走的弯路主要在寻找这个指定位置上. 对于指向性技能就不多说了,因为是有确切目标的(当然首先判断下技能能不能对 ...

  4. SpringBoot2.x项目初始化

    1. 项目初始化说明 使用SpringBoot生成器 修改application.properties为application.yml 启动运行SpringBoot项目 2. 初始化项目 Spring ...

  5. PHP控制结构if else,while，do while，for，foreach，break ，continue

    php中控制结构有 控制结构 判断分支 if else, 三元运算符,  switch case, 循环 while do while for foreach 跳出 break continue // ...

  6. emqx配置ssl

    1.生产自签证书 mkdir /etc/emqttd/certs/ && cd /etc/emqttd/certs/ openssl genrsa -out ca-key.pem 20 ...

  7. 泛微 e-cology OA 远程代码执行漏洞复现

    0x00 前言 Poc已在github公开,由于环境搭建较为复杂,所以我在空间搜索引擎中找了国外的网站进行复现 如果有想自行搭建环境复现的可以在公众号内回复“泛微环境”即可获取源码及搭建方式 0x01 ...

  8. Kotlin属性引用详解

    继续来学习Kotlin反射相关的,这次主要是跟反射属性相关的东东. 属性引用(Property Reference): 属性引用的用法与函数(方法)引用的用法是完全一致,都是通过::形式来引用的.下面 ...

  9. SQLAlchemy多对多

    创建多对多表 from sqlalchemy.ext.declarative import declarative_base Base=declarative_base() from sqlalche ...

  10. jdbc.DataSourceProperties$DataSourceBeanCreationException: Failed to determine a suitable driver class

    java.lang.IllegalStateException: Failed to load ApplicationContext at org.springframework.test.conte ...