- 博客(6)
- 收藏
- 关注
RSS订阅原创 vue后台管理项目左菜单栏伸缩-影响右侧内容宽度（可变宽不能缩小）
我们使用vue做后台管理时候，使用flex布局，el-menu左侧菜单栏有一定宽度，右侧路由出口router-view展示内容。内容区域样式设置flex=1就可以自适应了。问题：当左侧菜单栏缩进时，右侧内容自适应，宽度会变宽，el-table的style=100% table也会变宽再当左侧菜单栏伸展出来时，右侧内容就会超出视口宽度。这时右侧内容宽度超出了视口，并出现了滚动条 ，其实你将窗口放大左侧内容也会变宽，但是再缩小时却不会随着缩小，出现同样的问题。解决方法：给右侧内容..
2022-04-14 12:59:53
6708
3
原创 使用vue2-org-tree 树形图插件
如何使用vue2-org-tree来展示出架构关系，首先在vue-cli项目中npm i vue2-org-tree 插件在main.js中引用 import Vue2OrgTree from ‘’ vue2-org-tree’’; Vue.use( Vue2OrgTree )* 必须下载 npm i --save -D less less-loader , 不下载less就会报错，因为vue-org-tree内部就是lang= ‘’less’’ 规则（less-loader版本不能太高，不兼容..
2022-01-20 19:14:55
4314
2
原创 vue中使用Echarts
前几天我们做好了一个权限管理的平台，今天我们在这个平台里练习vue2如何使用echarts。如图这是echarts中的一个典型的关系图，每个圆圈都是一个节点，每两个节点相连就形成了这样一个关系网。如何引入echarts呢，最好就是去官网查看，它会给我们示例可以选择按需引入方式。首先要下载 npm i echarts -S , 然后根据文档一步步操作就好。需要注意的是，官网这里有关option里的数据是通过外部链接请求过来的，它使用jQuery的Ajax请求，但是我们使用的是vue，如果直..
2022-01-18 18:54:34
636
原创 手动创建菜单栏
手动创建菜单栏 一、介绍我们以往创建一个后台管理项目，首先想到的是vue-element-admin这是开源的后台管理模板，我们在做项目时可以套用这个开源的模板，但是这个模板涵盖了很多内容，有些是我们不需要的，所以这里我将该模板拆解，提取我自己需要的模块，这样就简化了许多。二、步骤分析（1）首先需要一个index.vue 这里就是整体框架内容。这里需要注意的是在router-view部分若加上transition动画标标签这时transition标签包裹的元素只能有一个，如果有多个那么就
2022-01-10 19:17:36
177
原创 vue-element-admin梳理
一、Layout组件分析Layout文件下的index.vue是vue-element-admin架构的主要界面，界面的左侧是菜单栏（sidebar）；界面的右侧栏顶部是Navbar，下面就是主要展示内容由<app-main/>包裹的<router-view/>二、sidebar组件分析sidebar文件下的index.vue就是侧边栏的架构，主要是有<el-menu><el-menu/>组成；el-menu里面是通过SidebarIt..
2022-01-04 19:11:00
2096
原创 通过文件流-下载文件 （结合自己的项目写的, dateFtt()是转换日期格式方法）
// 下载文件async downList (item, index) { let res = await api.downLoadExportList({fileName: item.fileName}, {responseType: "blob"}) this.currentdown = index let _this = this try{ if(res) { let blob = new Blob([res]) // 创建文件流URL .
2021-12-29 00:32:56
213
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人