vue怎么在一个页面里写两个表格_vue给多个el-table嵌套表单验证

可以使用 `ref` 属性来给不同的 `el-table` 元素命名，然后在需要进行表单验证的地方引用这些 `ref`，进行相关的表单验证。

以下是一个示例代码：

<template>
  <div>
    <el-form ref="form" :model="formData" :rules="rules" label-width="80px">
      <el-table ref="table1" :data="tableData1" stripe>
        <!-- 表格1的列定义 -->
      </el-table>
      <el-table ref="table2" :data="tableData2" stripe>
        <!-- 表格2的列定义 -->
      </el-table>
      <el-button type="primary" @click="submitForm">提交</el-button>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      formData: {
        // 表单数据
      },
      rules: {
        // 表单验证规则
      },
      tableData1: [
        // 表格1的数据
      ],
      tableData2: [
        // 表格2的数据
      ]
    };
  },
  methods: {
    submitForm() {
      // 表单提交逻辑
    }
  }
};
</script>

在以上代码中，我们给两个 `el-table` 元素分别命名为 `table1` 和 `table2`，然后在 `el-form` 表单中，我们可以使用 `ref` 属性来引用这些表格元素，进行表单验证。

例如，如果我们需要在表格1中对某一列进行表单验证，可以在该列的 `el-table-column` 组件中添加 `prop` 属性，指定该列对应的表单字段名称。然后在 `el-form-item` 组件中，可以使用 `prop` 属性来引用该表单字段，并使用 `rules` 属性来指定该表单字段的验证规则。

以下是一个示例代码：

<el-table-column label="姓名" prop="name">
  <template slot-scope="{ row }">
    <el-form-item prop="name">
      <el-input v-model="row.name"></el-input>
    </el-form-item>
  </template>
</el-table-column>

在以上代码中，我们给表格1中的姓名列添加了一个 `prop` 属性，指定表单字段名称为 `name`。然后在 `el-form-item` 中，使用 `prop` 属性来引用该表单字段，并使用 `rules` 属性来指定该表单字段的验证规则。

同样的，我们也可以在表格2中进行相同的操作，来实现多个表格的表单验证。