antd vue table表格内添加表单验证方法

业务需求；需要table内的某项或者某些项能编辑；并且需要校验规则

1.在form-model放置在 table 内

<!-- html -->
<advance-table
    bordered
    :scroll="{ x:'100%',y: 300 }"
    :columns="columns_white_list_edit"
    :data-source="siteList"
    :rowKey="(row,index) => row.siteId"
    :rowSelection="{selectedRowKeys:selectedRowKeysSite,onChange:onChangeSite,columnWidth:50}"
    :pagination="paginationSite"
    @change="handleTableChangeSite"
    :showToolbar="false"
  >
    <a-form-model :model="record" :ref="`formData_${index}`" slot="endTime" class="handle-btn-box" slot-scope="{text, record, index}">
      <a-form-model-item prop="endTime" :rules="{ required: true, message: '请选择' }" >
        <a-date-picker v-model="record.endTime" @change="changeItemTime(record.siteId,index)" showTime format="YYYY-MM-DD hh:mm:ss" valueFormat="YYYY-MM-DD hh:mm:ss" :getCalendarContainer="() => win.document.body" />
      </a-form-model-item>
    </a-form-model>
  </advance-table>

<!-- js -->
for (const key in _this.$refs) {
  if (key === 'con') break
  _this.$refs[key].validate(async valid => {
    if (!valid) return false
  })
}

2.将table放置在form-model 内

<!-- html -->
<a-form-model :model="reqData" ref="formData">
  <advance-table
    bordered
    :scroll="{ x:'100%',y: 300 }"
    :columns="columns_white_list_edit"
    :data-source="reqData.siteList"
    :rowKey="(row,index) => row.siteId"
    :rowSelection="{selectedRowKeys:selectedRowKeysSite,onChange:onChangeSite,columnWidth:50}"
    :pagination="paginationSite"
    @change="handleTableChangeSite"
    :showToolbar="false"
  >
    <template slot="endTime" slot-scope="{text, record, index}">
      <a-form-model-item :prop="`siteList.${index}.endTime`" :rules="{ required: true, message: '请选择' }" >
        <a-date-picker v-model="record.endTime" showTime format="YYYY-MM-DD hh:mm:ss" valueFormat="YYYY-MM-DD hh:mm:ss" :getCalendarContainer="() => win.document.body" />
      </a-form-model-item>
    </template>
  </advance-table>
</a-form-model>

<!-- js -->
_this.$refs.formData.validate(async valid => {
          if (!valid) return
})

重点是 :prop="siteList.${index}.endTime"