更改 Quasar table 中的特定列

Question

如何更改 Quasar 的 table 中特定列的样式？ 我阅读了文档，但没有看到如何在不定义 Vue 布局页面中的所有列的情况下更改它。

它有效，但在第一列。

<template v-slot:body-cell-name="props">
    <q-td :props="props">
      <div>
        <q-badge color="purple" :label="props.value" />
      </div>
      <div class="my-table-details">
        {{ props.row.details }}
      </div>
    </q-td>
</template>

Answer 1

您提供的示例来自正确的Quasar Docs。 它适用于第一列，因为第一个 属性 的名称是 name - 因此 body-cell-name.

如果在此示例中您想使用 属性 protein 更改第五列，则需要调用该插槽 body-cell-protein