问题
有两个v-if,绑定元素是item-wrap。第一个item-wrap里面包裹着四个item,第二个item-wrap里面包裹着三个item。每一个item是一个echarts。
在我从第二个item-wrap切换到第一个item-wrap显示时,发现每一个item的宽度变成了第二个item-wrap里item的宽度,导致溢出。
解决
在两个if的父级元素增加key值即可
:key="Math.random()"
具体原因:
vue在渲染元素时由于组件太过于相似,导致没有识别出来。将第一个item-wrap里面的item放置到了第二个item-wrap。
测试:我在里面设置了name属性为不同的值,在第二个item-wrap里面看到了第一个item-wrap的item的name名称。