Vue 方法 return 属于单个用户的所有属性 returning [object Object]

Question

下面是一个下拉列表，理想情况下应该显示属于特定用户的所有 table 的列表。

<v-select
    :items="allTables"
    :item-text="tableNames"
    return-object
/>

这是allTables的结构。可能有更多或更少取决于用户：

[
    {
        "id": 3,
        "name": "TABLE"
    },
    {
        "id": 4,
        "name": "KOP"
    }
]

这是显示table姓名的方法：

tableNames() {
    this.allTables.forEach(el => {
        return element.map(a=>a.name)
    });
},

最初是这样的（但是它导致了我在其中一个答案中列出的错误）：

tableNames: item => item.name;

控制台日志记录

console.log(el.map(a=>a.name))

在上面的方法中 return 如下所示的数组（'TABLE' 是一个 table 的名称，'KOP' 是另一个 table).

这不是 return 任何错误，而是 v-select return [对象对象] 的选项。我不确定我做错了什么，我能问一下为什么 return 这样做吗？

获取所有table的函数：

public function retrieveAllTables()
{
    return Auth::user()->client->tables()->get();
}

数据变量：

data: () => ({
    allTables: []
}),

API 请求：

getAllTables() {
    apiClientGet(
        routes["pages.retrieveAllTables"],
        null,
        response => {
            this.allTables.push(response.data.flat());
            // console logging this.allTables shows the structure above
        }
    );
},

Answer 1

问题是 api 请求实际上并没有将响应推送到所有表。

getAllTables() {
    apiClientGet(
        routes["pages.retrieveAllTables"],
        null,
        response => {
            this.allTables = response.data;
            return this.allTables;
        }
    );
},

我想通了，因为在 beforeMount 中记录 allTables 的控制台在不应该有的情况下返回了一个空数组

Vue 方法 return 属于单个用户的所有属性 returning [object Object]

Vue method to return all properties belonging to a single user returning [object Object]

javascript

arrays

json

vue.js

vuetify.js