vue + element,v-if和validate搭配出坑

vue + element前端常用搭配
今天遇到个问题el-form的验证出现个别参数不能验证，代码如下

<el-dialog title="创建审批配置" :visible.sync="dialogVisible" class="tems_dialog" width="780px" :close-on-click-modal="false" :show-close="false">
                    <el-form :model="formData" :rules="rules" ref="formValidate" label-width="100px" style="display: flex;flex-wrap:wrap;">
                        <!-- 任务类型 -->
                        <el-form-item prop="taskType" label="任务类型">
                            <el-select size="small" class="tems_Input comment-width" clearable v-model="formData.taskType">
                                <el-option v-for="item in taskType" :key="item.id" :value="item.id" :label="item.name" />
                            </el-select>
                        </el-form-item>
                        <el-form-item v-if="formData.taskType === 0 && formData.taskType !==''"  prop="equipmentType" label="设备类型">
                            <el-select size="small" class="tems_Input comment-width" clearable v-model="formData.equipmentType">
                                <el-option v-for="item in equipmentTypeList" :key="item.id" :value="item.id" :label="item.name" />
                            </el-select>
                        </el-form-item>                 
                    </el-form>

第二个的显示根据第一个的选择结果判断显示与否，结果在提交的时候无法判断第二个select的值，找了好多都没有解决办法，根据vue和element的源码了解，大概是v-if在操作dom的时候，在根节点进行的删减，而element在封装的时候没考虑这块，导致rules判断的时候，无法取到v-if添加进来的prop值
解决办法

<div v-if="formData.taskType === 0 && formData.taskType !==''"   >
<el-dialog title="创建审批配置" :visible.sync="dialogVisible" class="tems_dialog" width="780px" :close-on-click-modal="false" :show-close="false">
                    <el-form :model="formData" :rules="rules" ref="formValidate" label-width="100px" style="display: flex;flex-wrap:wrap;">
                        <!-- 任务类型 -->
                        <el-form-item prop="taskType" label="任务类型">
                            <el-select size="small" class="tems_Input comment-width" clearable v-model="formData.taskType">
                                <el-option v-for="item in taskType" :key="item.id" :value="item.id" :label="item.name" />
                            </el-select>
                        </el-form-item>
                        <el-form-item prop="equipmentType" label="设备类型">
                            <el-select size="small" class="tems_Input comment-width" clearable v-model="formData.equipmentType">
                                <el-option v-for="item in equipmentTypeList" :key="item.id" :value="item.id" :label="item.name" />
                            </el-select>
                        </el-form-item>                 
                    </el-form>
                    </div>

这样就解决了，但是具体原理，不怎么了解，知道的大神可以帮忙解答下么？