1

我有一个 vuetify v-data-table,目前每个项目上都有可展开的图标。它工作正常,但我有兴趣只在项目的特定条件为真的行上使用图标,我似乎无法弄清楚如何去做。

我有:

<v-data-table
    ref="table"
    :headers="headers"
    :items="events"
    :search="search"
    loading="false"
    :single-expand="true"
    show-expand
    item-key="uuid"
    :expanded.sync="expanded"
    class="elevation-1"
>

  <template v-slot:expanded-item="{ headers, item }" >
      <slot v-if="item.showTxnID">
        <td :colspan="headers.length/2" >
          <v-layout justify-center>
            <v-btn class="primary--text" @click="searchTxn(item.txnID)" ref="txnIDText">Search txn: <strong>{{item.txnID}}</strong></v-btn>
          </v-layout>
        </td>
      </slot>
  </template>
</v-data-table>

我感兴趣的条件是:item.showTxnID 为真。我已经在插槽上进行了这项工作,但是如果这些行的展开项下拉菜单根本没有显示,那就太好了。

当我将此条件添加到上面的标记时,事件表加载失败并且失败并出现以下错误:失败

任何帮助将不胜感激,谢谢!

4

0 回答 0