Element UI 左侧折叠导航栏配合el-asid文字闪烁的问题

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-eayAJOoj-1600259160168)(C:\Users\22725\Desktop\对对对.gif)]

问题描述如图所示

解决的方法也是自己在网上误打误撞找到了

首先是给el-menu定义一个class样式

  <el-aside width="initial" class="home_aside"><el-menuclass="el-menu-vertical-demo"background-color="#718a7f":router="true":unique-opened="true":collapse-transition="true":collapse="isCollapse"active-text-color="#ffd04b"></el-menu></el-aside>

然后在样式中进行修改，我这里用的是scss

<style>
.el-menu-vertical-demo {height: 100vh;&:not(.el-menu--collapse) {width: 180px;}
}
</style>

这个样子就完美解决了问题，

element-UI 中beforeLeave用法

问题：切换tabs的每一项时需要判断某些条件来进行判断是否跳转，例如：我在当前导航需要选中一个必须值才可以跳转到下一个页面这个时候按照正常的逻辑来写的话 tabs内容栏不会切换，但是tabs标签栏就进行切换了，需要用到beforeLeave来进行拦截，效果很好

这个是el-tabs中的一个属性绑定了一个方法

      <el-tabs :before-leave='leaveTab'><el-tab-pane label="主合同" name="False"></el-tab-pane><el-tab-pane label="子合同" name="True"></el-tab-pane></el-tabs>leaveTab(activeName, oldActiveName) {console.log(activeName,oldActiveName)//False True// do something},

echarts 无法获取属性“getAttribute”的值: 对象为 null 或未定义错误解决方法

我在vue的项目中呢把echarts的方法放到了created中，到值拿不到DOM元素，所以就无法获取到getAttribute的值，解决方法就是把echarts的方法放到mounted中执行或者是在created中利用this.$nexttick中执行

Vue Element-UI el-aside组件永远有一个300px的width

首先对全局的300px数值进行全局搜索，查看是不是因为代码某处设置了宽度，导致的问题。结果并没有发现可疑的设置。
检查代码是否正确作用，确定对aside-style的相关设置已经作用到了组件上，只是宽度被覆盖，手动去除覆盖的元素样式，组件正常运作。
直接查看组件源码，发现其接受一个width值，并使用元素样式设定这个值，若没有传width值，则默认指定width为300px，破案了。

组件中的源码如下，但是设定了默认的宽度，所以在没有指定宽度的时候，会按照默认的宽度进行设定，且优先级极高。

使用代码：

<el-aside id="aside-style" width="18%">...
<el-aside>
123

指定宽度18%后，宽度按照指定样式显示