[Vue 警告]：道具无效：道具"Items"类型检查失败。预期的阵列，得到了承诺

Question

我是整个节点技术堆栈的新手，并试图通过承担一个项目来提高自己。 在这一点上，我已经取得了适度的成功(可能是偶然的(，但我目前陷入了困境。 我的客户端正在使用"axios，vue，vue-router，vuetify"和其他一些。 服务器端代码是"axios，bluebird，sequelize和sqlite3"。

我的问题如下，我正在尝试通过进行以下函数调用来填充"v-data-table"：

<v-data-table
:headers="task_headers"
:items="getTasks(props.item.upgrade_id)"
hide-actions
item-key="task_id"
>

我的函数如下所示：

methods: {
async getTasks (id) {
try {
console.log('JAC in getTask value of id is: ', id)
this.tasks = await TasksService.show(id)
console.log('JAC value of this.tasks is typeof: ', typeof this.tasks)
console.log('JAC value of this.tasks values are: ', Object.values(this.tasks))
console.log('JAC value of this.tasks keys are: ', Object.keys(this.tasks))
return this.tasks.data
} catch (err) {
console.log(err)
}
}

我的调试消息生成以下输出：

JAC value of this.tasks is typeof:  object
JAC value of this.tasks values are:  
(6) [Array(9), 200, "OK", {…}, {…}, XMLHttpRequest]0: 

JAC value of this.tasks keys are:  
(6) ["data", "status", "statusText", "headers", "config", "request"]

this.tasks 值 9 的数组携带从我需要的数据库返回的数据，但我不明白如何返回数据。 我对后端还有许多其他服务调用，这些调用工作正常。v-data-table 期待一个数组，我不明白我缺少什么来让它工作。

Answer 1

async getTasks (id( { <- 删除异步，并返回一个数组

您期望在 v-data-table 中有一个数组，并且使用 async 属性，它将返回一个承诺，因此您得到了该错误。

如果你不想删除它，你可以做这样的事情。

getTasks(props.item.upgrade_id).then((data) => {
this.tasks = data;
})
<v-data-table
:headers="task_headers" 
:items="tasks"<- updated this line and no longer it will return a promisa
hide-actions
item-key="task_id"
>