html的flex布局Element-ui中的el-table在flex下的宽度⾃适应问题
项⽬需求：页⾯中分成左右两边，⼀边的宽度⾃适应（⾥⾯嵌套的是el-table），⼀边的宽度固定
问题：使⽤flex布局，使⽤flex:1后el-table只能⾃适应扩⼤，不能⾃适应缩⼩
Debug：通过控制台发现组件⽣成的table的宽度是动态计算的，翻查源码，发现以下代码段
也就是说，组件的resize事件是绑定在this.$el上了，这应该就是的原因所在了。
flex容器下的width:100%会⼀直向上继承，直到flex容器下第⼀级⼦元素，但是当某个⼦元素的宽度出现固定值并且⼤于flex伸展的宽度的时候，那么容器就不会收缩，⾃然也就触发不了resize事件了。
解决⽅案：可以将设置了flex属性的容器设置position:relative，然后在有el-table的⼦元素加多⼀层div包裹内容，设置position:absolute; width:100%；继承⽗级宽度，那么内容也会继承该div的宽度了

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。