iview 如何设置sider宽度
2020-11-25 本文已影响0人
沧澈
iview layout组件中,sider设置了默认宽度和最大宽度,在css样式文件中修改无效,原因是iview默认样式设置在了element.style中,只能通过行内样式修改
样式如下:
![](https://img.haomeiwen.com/i9966967/e2de2e508d20ad93.png)
![](https://img.haomeiwen.com/i9966967/b0bfc7d4efe16706.png)
修改方式:
1.官方文档中写明修改宽度通过传参数width实现
![](https://img.haomeiwen.com/i9966967/291b865f01ef1a49.png)
详见iview组件 layout部分
布局 Layout - iView (iviewui.com)
2.使用行内样式覆盖源样式
<sider style="width: 300px;min-width: 300px;max-width: 300px;flex: 0 0 300px;">
补充:
神奇的技巧:
如果想让sider的宽度自适应父元素,将width的值设置为空即可
代码:
<sider :width="''">
sider的class
![](https://img.haomeiwen.com/i9966967/6816143886b61e76.png)
原创