elementui-Layout-使用el-row布局，缩放出现乱位问题

Layout-使用el-row布局，缩放出现乱位问题

问题描述

1. 使用el-row,el-col布局页面时，缩放页面，出现乱位
2. 问题出现在一个el-row下面，放了多个el-col

展示代码

// 此处el-row放了5个el-col,出现问题
<el-row style="display:flex;flex-warp:warp;">
    <el-col class="mb12 w420">
        <el-form-item label="过账时间">
            <el-date-picker class="select-time-datetimerange" v-model="timeList1"
                type="datetimerange" range-separator="⇀" start-placeholder="开始时间"
                end-placeholder="结束时间" unlink-panels :default-time="['00:00:00','23:59:00']"
                format="yyyy-MM-dd HH:mm" value-format="yyyy-MM-dd HH:mm" align="left"
                @change="(time)=>{selectTwoTimeHandle(time,'billStartTime','billEndTime')}">
            </el-date-picker>
        </el-form-item>
    </el-col>
    <el-col class="mb12 w420">
        <el-form-item label="订单支付方式">
            <el-select v-model="filters.paymentType" clearable placeholder="请选择"
                style="width:300px;">
                <el-option v-for="item in zfList" :key="item.value" :label="item.label"
                    :value="item.value">
                </el-option>
            </el-select>
        </el-form-item>
    </el-col>
    <el-col class="mb12 w420">
        <el-form-item label="收款状态">
            <el-select v-model="filters.isReceipt" clearable placeholder="请选择"
                style="width:300px;" @change="selectIsReceipt">
                <el-option v-for="item in zdStatusList" :key="item.value" :label="item.label"
                    :value="item.value">
                </el-option>
            </el-select>
        </el-form-item>
    </el-col>
    <el-col class="mb12 w420">
        <el-form-item label="收款状态">
            <el-select v-model="filters.isReceipt" clearable placeholder="请选择"
                style="width:300px;" @change="selectIsReceipt">
                <el-option v-for="item in zdStatusList" :key="item.value" :label="item.label"
                    :value="item.value">
                </el-option>
            </el-select>
        </el-form-item>
    </el-col>
    <el-col class="mb12 w420">
        <el-form-item label="收款状态">
            <el-select v-model="filters.isReceipt" clearable placeholder="请选择"
                style="width:300px;" @change="selectIsReceipt">
                <el-option v-for="item in zdStatusList" :key="item.value" :label="item.label"
                    :value="item.value">
                </el-option>
            </el-select>
        </el-form-item>
    </el-col>
</el-row>

解决方法

<el-row style=" display: flex;flex-wrap: wrap;">
</el-row>