Vue3动态生成form表单校验遇到的问题。获取表单ref值是null。

项目是基于vue3的项目，需求是点击添加按钮弹出modal对话框，对话框内是form表单，通过添加按钮动态添加表单然后提交。
遇到的问题：点击提交按钮需要校验所有表单项的必填项；
思路：1、先声明一个数组接收校验结果；
2、再遍历每个动态生成的表单并触发表单自带的validate方法并放到事先声明的数组中；
3、再用Promise.all方法校验数组中的结果是否全部通过；

//声明数组
let res = []
//遍历
    for (let i = 0; i < dataList.value.length; i++) {
    //结果加到数组中
      res.push(formRef[i].validate())
    }
    //校验
    Promise.all(res).then(()=>{
    //提交动作
})

但是触发事件时会报错找不到validate方法，打印formRef结果显示value是null

解决方案：
1、在dataList数据中加入一个字段el；
2、动态给form表单绑定ref值 :ref="el => (item.el = el)"；
3、通过el属性可以拿到validate方法

let res = []
    for (let i = 0; i < dataList.value.length; i++) {
      res.push(dataList.value[i].el.validate())
    }

4.6日更新一波，
上线后出现问题，当删除除了最后一条之外的的动态生成的表单时候，el会变成null导致报错，什么原因造成暂时没找到答案，只能用另一种方法进行校验。。

 for (let i = 0; i < dataList.value.length; i++) {
      let item = dataList.value[i]
      //这里判断每个生成的表单内的必填项是否为空
      if (!item.paymentMilepostName || !item.money || !item.planPaymentTime) {
        return
      }
    }

通过遍历每一个生成的表单内的必填项是否为空，然后再进行提示这种方法也能达到效果。