vue3中多个表单用ref校验(优雅写法)` ``` <el-form :model="form" :ref="(el

 <el-form :model="form"  :ref="(el) => (formsRef.el1 = el)">
 
 <el-form :model="form"  :ref="(el) => (formsRef.el2 = el)">
 
 const formsRef: any = ref({})

const submitForm = async () => {
    // 创建一个数组来存储所有的验证 Promise
    const validationPromises = Object.keys(formsRef.value).map((key) => {
        return new Promise((resolve, reject) => {
            const form = formsRef.value[key]
            if (form) {
                form.validate((valid: any) => {
                    if (valid) {
                        console.log(`${key} 表单验证成功`)
                        resolve(true) // 表单验证成功
                    } else {
                        console.log(`${key} 表单验证失败`)
                        reject(`${key} 表单验证失败`) // 表单验证失败
                    }
                })
            } else {
                resolve(false) // 如果表单不存在，视为通过
            }
        })
    })

    try {
        // 等待所有验证完成
        await Promise.all(validationPromises)
        console.log('所有表单验证成功')
        console.log(form.value); // 提交的表单数据
    } catch (error) {
        console.error('验证失败:', error)
        // 处理验证失败的情况，例如显示错误消息
    }
}