Vue+ElementUI 如何实现优雅换行

`

<el-row>
 <div v-for="(item,index) in xxx">
   <el-col :span="6">
    <my-component>...</my-component>
</el-col>
     <div v-if="(index+1)%4===0">    
     </el-row>
     <el-row>
    </div>
   </div> 
</el-row>`

但是这样换行会导致里面的el-row被嵌在DIV里面。与外层的el-row不在同一层级上。

我的component 也会出现其它一些奇怪的问题。

有没有其它办法。
我想多个组件（显示图表）并排显示在一行，达到若干个后（比如设置的4个），则进行换行.

有没有其它更好的排列的写法。谢谢！