javascript - 无法使用 vuetable-2 中的数组访问字段

Question

我有以下 JSON 数组并在 vue.js 中使用 vuetable-2

在领域，我有

fields: [
            {
               name: 'name',
               title: 'Name'
            },
            {
               name: 'roles',
               title: 'Roles'
            }

         ],

Angular 色列没有显示任何值。

但是我可以通过单击单元格来访问数组

<vuetable ref="vuetable"
      :api-url="url"
      :http-options="headerOptions"
      fields="fields"
      pagination-path=""
      :css="css.table"
      :multi-sort="true"
      @vuetable:pagination-data="onPaginationData">

此外，在 DetailRow.vue 中，我可以访问相同的数组

<template>
    <div @click="onClick">
        <div class="inline field">
            <label>Description: </label>
            <span>{{rowData.name}}</span>
        </div>
        <div class="inline field">
            <label>Role: </label>
            <span>{{rowData.roles[0].roles}}</span>
        </div>
    </div>
</template>

如何直接访问表格列中的数组？

Answer 1

字段定义中的name选项不支持数组引用，但callback函数可以解决该问题。如果您想显示 Angular 色，请尝试此操作。

fields: [
            {
               name: 'name',
               title: 'Name'
            },
            {
               name: 'roles',
               title: 'Roles',
               callback: 'getRole',
            }

         ],

方法应该如下所示

methods: {
            getRole(value) {
                return value[0].roles;
            },
}