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
}
}

HTML页面代码：

<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": "doxydiwapo@mailinator.com",
        "customer_email": "musybecapa@mailinator.net",
        "customer_phone": "+4382251059",
        "customer_fax": "+1 (223) 134-7141",
        "customer_mobile": "+4382251059",
        "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: [],

laravel vue分页返回无效的道具类型，检查道具失败

2 个答案: