vue中在填报表单中多个td中的多个el-input输入框实时输入数据，如何实时显示最小值

如果你想在填报表单中的多个 `<td>` 中的多个 `el-input` 输入框实时输入数据，并实时显示最小值，你可以使用类似的方法。以下是一个示例：

<template>
  <div>
    <table>
      <tr v-for="(row, index) in tableData" :key="index">
        <td v-for="(value, columnIndex) in row" :key="columnIndex">
          <el-input v-model="tableData[index][columnIndex]" @input="updateMinValue" />
        </td>
      </tr>
    </table>
    <p>最小值：{{ minValue }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        [null, null, null],
        [null, null, null],
        [null, null, null],
      ],
      minValue: null,
    };
  },
  methods: {
    updateMinValue() {
      const flattenedData = this.tableData.flat();
      const validInputs = flattenedData.filter(value => value !== null && value !== '');
      if (validInputs.length > 0) {
        this.minValue = Math.min(...validInputs);
      } else {
        this.minValue = null;
      }
    },
  },
};
</script>

在上面的示例中，`tableData` 数组存储了每个 `<td>` 中的输入框的值。通过使用双向绑定的 `v-model`，可以实时更新数组中的值。当输入框的值发生变化时，`@input` 事件会触发 `updateMinValue` 方法，该方法会重新计算最小值并更新 `minValue`。

请注意，为了排除数组中的 `null` 和空字符串值，我们在计算最小值之前使用了 `filter` 方法。如果没有有效的输入值，`minValue` 将被设置为 `null`。

希望这对你有所帮助！