赞
踩
一、菜单路由跳转
要实现路由跳转,先要在el-menu标签上添加router属性。
然后只要在每个el-menu-item标签内的index属性设置一下url即可实现点击el-menu-item实现路由跳转。
当然也可以在每个el-menu-item标签内的router属性设置一下url即可实现点击跳转切优先级较index高。
二、是否只保持一个子菜单的展开配置时报错
配置:<el-menu unique-opened = true>
报错:Invalid prop: type check failed for prop "uniqueOpened". Expected Boolean, got String.
改为:<el-menu :unique-opened = true> 或 <el-menu :unique-opened = "true">
三、修改element-ui样式
因为官方文档并不详细,像官方文档没有说el-aside的宽度怎么设置。
然后我发现,给el-aside的class里设置宽度不行,貌似会被元素样式覆盖掉,非得设置style="width:210px"。
问题来了:我点击某个按钮,通过jequery或者全局变量控制修改el-aside的宽度。同时当我页面上有定时器不断刷新存在时,修改的宽度会恢复成style="width:210px"。
目前解决的办法只有一个,修改element-ui元素样式,再通过jq修改元素el-aside的宽度时,无论定时器setTimeout怎么刷新也不会影响当前样式修改。
此处注意:
1、修改样式时通过全局变量控制,会明显出现卡顿现象,最后还是选择通过jequery的.css或者.animate方法。
2、setTimeout比setInterval对内存影响更友好。
3、正经说说怎么通过正规渠道修改element-ui样式:官网API文档没有那就只能看源码。
比如修改el-aside的宽度,找到文件\node_modules\element-ui\packages\aside\index啥也没有,引入了Aside from './src/main';
继续查看文件./src/main
<aside class="el-aside" :style="{ width }">
<slot></slot>
</aside>
以上可以看出el-aside可以设置修改宽度通过
props: {
width: {
type: String,
default: '300px'
}
}
属性width默认300px,由此可以按照源码样式修改,注意当前值的类型是String,所以设置如下:
<el-aside :width="'210px'">
210px一定要用单引号''括起来转换成String类型。
四、border-image导致el-table表头的边框时有时无
现象:el-table__header左右边框有时候不显示
区别:表头的高宽不一样
改:border-image: linear-gradient(150deg, #1ddae4 , #2698ec) 30 30;
为:border-image: linear-gradient(150deg, #1ddae4 , #2698ec) 5;
就可以了……
原因:
border-image: linear-gradient()后面的四个参数分别表示top right bottom left
有一些高宽限制肯定不能超过外层div的高宽,然而具体的限制,参考如下博文,我试了下还是不对,暂时找不到其他资料。
https://www.cnblogs.com/zhangdongya/p/8677630.html
包括这四个参数设置 30 30px 1/30px的差别为什么中间那个不可以ÿ
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。