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. 科普帖：Linux操作系统

    使用计算机必然会接触操作系统,现代操作系统已经发展的十分成熟,一般用户都可以很轻松的使用计算机.然而,对于要利用计算机进行专业开发和应用的用户来说,需要更加深入地理解操作系统的原理和运行机制,这样才能 ...

  2. 【转载】C#中使用float.TryParse方法将字符串转换为Float类型

    在C#编程过程中,将字符串string转换为单精度float类型过程中,时常使用float.Parse方法,但float.Parse在无法转换的时候,会抛出程序异常,其实还有个float.TryPar ...

  3. SAP Hybris Discount group，折扣组，折扣记录，用户组几组概念的关联

    在backoffice的Price Settings->Discount->Customer Discount Groups菜单下面,创建一个新的Customer Discount Gro ...

  4. MySQL5.7应当注意的参数

    简介: 本篇文章主要介绍 MySQL 初始化应当注意的参数,对于不同环境间实例迁移,这些参数同样应当注意. 注: 本文介绍的参数都是在配置文件 [mysqld] 部分. server_id 和 log ...

  5. selenium窗口句柄以及对话框处理

    多窗口.句柄: 1.获取当前句柄:driver.current_window_handle 2.获取所有句柄:driver.window_handles 3.切换句柄:driver.switch_to ...

  6. SQL Server行转列、不确定列的行转列

    本文使用的方法: 1.用Case When 2.PIVOT函数 首先,模拟一张表: -- 创建模拟数据 CREATE TABLE #TempSubjectResult ( StudentName NV ...

  7. Arm Qt编译Qt例程出错 GLES3/gl3.h: No such file or directory 解决方法

    工作环境 PC:Ubuntu18.04QtCreator: 4.8.2交叉编译环境:野火imxull6开发板提供的 5-编译工具链->qt交叉编译工具 在之前博客配置成功的交叉编译环境,编译Qt ...

  8. linux中apt-get使用

    apt-get简介 在Ubuntu系统中,经常要用到apt-get install指令来安装软件,由于常常需要root权限来操作,所以搭配sudo食用口感更佳,apt-get指令对于安装.卸载.升级软 ...

  9. Linux-普通用户切换为root身份

    Linux 下普通用户免密码切换 root 用户 具体步骤: 1)编辑 su 文件打开第四行注释 # vim /etc/pam.d/su 2)将用户添加到 wheel 组 # usermod -G w ...

  10. mongodb 常见问题处理方法收集

    问题1:非正常关闭服务或关机后 mongod服务无法正常启动 在使用中发现mongodb 的服务可能因为非正常关闭而启动不了,这时我们通过 删除data目录下的 *.lock文件,再运行下/mongo ...