如何访问 vue-good-table 中的 header 索引

Question

如何在分组 table 中访问这些 header 的索引？

table_screenshot

Answer 1

您可以使用 props.column 获取列名。 props.column 将为您提供完整的列对象，以便您可以从中获取索引。 props.column.field 会给你列名 title。

1. 您可以使用 props.column.originalIndex
检查索引
2. 原始行对象可以通过props.row
访问
3. 当前显示的table行索引可以通过props.index访问。
4. 可以通过 props.row.originalIndex 访问 original row index。
5. 然后您可以使用 rows[props.row.originalIndex].
访问 原始行对象
6. 列对象可以通过props.column
访问
7. 您可以通过 props.formattedRow
访问 格式化的行数据 （例如 - 格式化日期）

例如：

<vue-good-table
  :columns="columns"
  :rows="rows">
  <template slot="table-row" slot-scope="props">
    <span v-if="props.column.field == 'age'">
      <span style="font-weight: bold; color: blue;">{{props.row.age}}</span> 
    </span>
    <span v-else>
      {{props.formattedRow[props.column.field]}}
    </span>
  </template>
</vue-good-table>

Source

Answer 2

我刚找到，答案就在图片里

{{props.row.vgt_id}}