拉拉维尔 vue 分页返回无效的道具类型检查失败

Question

我开始使用nuxt js，我已经安装了laravel-vue-pagination插件，我不知道为什么在我的控制台系统上收到此错误消息：

[Vue warn]: Invalid prop: type check failed for prop "data". Expected Object, got Array 

这是我的代码：

getResults (page = 0) {
this.$axios.$get('mydomain.com/api/Customer/loadCustomers/' + page).then((response) => {
this.laravelData = response.data
})
},

这是我的数据：

data () {
return {
laravelData: {},
formFields: {},
search: null,
editMode: true,
customerId: null,
refresh: false
}
}

网页代码 ：

<pagination :data="laravelData" @pagination-change-page="getResults" />

此外，我已经使用以下方法注册了组件：

import Vue from 'vue'
Vue.component('pagination', require('laravel-vue-pagination'))

我的 JSON 反馈：

{
"success": false,
"total": 6,
"per_page": 10,
"current_page": 0,
"last_page": 1,
"data": [
{
"id": "34",
"customer_name": "Philippe Lesen",
"customer_company_name": "[e-mail]",
"customer_email": "[e-mail]",
"customer_phone": "[phone]",
"customer_fax": "[phone]",
"customer_mobile": "[phone]",
"customer_website": "https://www.qusopywode.org.au",
"customer_type": "2",
"billing_address": "Cupiditate alias asp",
"billing_city": "Delectus reprehende",
"billing_state": "In velit illo ut vol",
"billing_zip": "73660",
"billing_country": "TH",
"shippingaddr_id": null,
"currency": "EUR",
"sales_representative": null,
"payment_condition": null,
"payment_method": null,
"tax_preference": "1",
"invoice_notification": "1",
"note": null,
"status": null
}
]
}

Answer 1

我使用this.laravelData = response解决了这个问题

Answer 2

您解决了这个问题。 这就是为什么...

将 laravelData 声明为对象

laravelData: {},

但你分配它

this.laravelData = response.data

到数组

"data": [

另一个解决方法可能是将laravalData声明为数组，也许您只会看到数据，这看起来像您想要的。

laravelData: [],