element-plus表单验证bug

遇到问题表单验证bug,待解决

出错地方

const putWorkHandle = async () =>{
    console.log(formRef.value)
 // 当表单valid为true时，这个注释下面代码都不运行，当表单valid为false时会运行下面代码
    formRef.value.validate(async (valid) => {
        console.log(valid)
        if (valid) {
            console.log(data.value,formData.value.orderId)
            const dataState = {
                orderId:formData.value.orderId,
                workLoads: data.value
            }
            const state = await orderState(dataState)
        }else{
            console.log(data.value,formData.value.orderId)

        }
    })
}

下面完整代码

// rule.js
export const rule=[
    chooseTime (form){
        return [
            {required: true, message: '预期时间不能为空', trigger: 'blur' },
            {validator:(rule, value, callback) =>{
                const chooseTime = new Date(value)
                const newDate = new Date()
                if (chooseTime < newDate) {
                    callback(new Error('预期时间不能小于当前时间!'))
                }
                }, trigger: 'blur' },
        ]
    }
]

const init = async (data,boolean) =>{
    console.log(data)
    title.value = data.orderTitle
    formData.value = data
    // dept.deptName = dept.deptName
    dialogFormVisible.value = true
    disabled.value = boolean
    const param = {state:[1],manageId:data.toId}
    projectList.value = await getManagerProjectList(param)
    console.log(projectList.value)
}
const formData = ref()

const rules = reactive(
    {
        expectationTime: rule.chooseTime(formData)
    }
)



const putWorkHandle = async () =>{
    console.log(formRef.value)
 // 当表单都为true时，这个注释下面代码都不运行，表单不是完整的时候会运行下面代码
    formRef.value.validate(async (valid) => {
        console.log(valid)
        if (valid) {
            console.log(data.value,formData.value.orderId)
            const dataState = {
                orderId:formData.value.orderId,
                workLoads: data.value
            }
            const state = await orderState(dataState)
        }else{
            console.log(data.value,formData.value.orderId)

        }
    })
}

<el-form-item label="预计完成时间" :label-width="formLabelWidth" prop="expectationTime">
   <el-date-picker v-model="formData.expectationTime">
   </el-date-picker>
 </el-form-item>
 <el-button type="primary" @click="putWorkHandle" v-if="disabled">
 确认
</el-button>

表单时正确的时候，promise为pending，返回undefined

表单时错误的时候，promise为full，返回false

那应该时代码逻辑错误了，导致promise没有未full现在找不到是哪错

• 请看👉 ：elementUI编辑与新增弹窗结合表格常见bug解决方案
• 除此之外, 这篇博客: element 使用过程中遇到的问题及解决方法中的 Bug1： 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

• 在测试IE时，发现我的项目Dialog会出现以下两个问题

  （1）在 Dialog 出现时 body 滚动没有锁定

  （2）遮罩覆盖了内容，出现在了内容上方【严重】

  这两个问题均在IE下会出现，问题（2）可能是我的项目问题，当然我也怀疑是不是因为Dialog DOM节点较深（12层）导致IE渲染出错？但这两个问题最终都解决了，方法如下：

  

  只需将这个属性设置为true即可。