element plus Form循环表单使用

<el-form key="1" ref="ruleFormRef" :model="infoForm" :rules="infoFormRules" :inline="true"
    label-position="top">
   <div v-for="(item, index) in infoForm.items" :key="index">
    <el-form-item label="服务器名称" :prop="'items.' + index + '.serverName'" 
   :rules="infoFormRules.serverName">    
   <el-input style="width: 100%" v-model="item.serverName" placeholder="请输入服务器名称">           </elinput>
   </el-form-item>
    <div v-if="infoForm.items.length > 1" @click="deleteserver(index)">删除</div>
   </div>
   <div  @click="nextClick(ruleFormRef)">提交</div>
  </el-form>
const ruleFormRef = ref()
const infoForm = ref({
    items: [
        { 
          serverName: "",
        }
    ]
})
const infoFormRules = ref({
serverName: [{ required: true, message: "请输入服务器名称", trigger: "blur" }],
})
 //添加
  const addserver=()=> {
    infoForm.value.items.push({
       serverName: "",
    });
  }
    //删除
  const deleteserver=(index)=> {
    infoForm.value.items.splice(index, 1);
  }
  async function nextClick(formEl) {
    if (!formEl) return;
    await formEl.validate((valid, fields) => {
        if (valid) {
         }
    });