javascript - Invalid prop: type check failed for prop "items". Expected Array, got String - Stack Overflow

admin管理员组

文章数量:1310431

I have a dropdown in vue js.

<v-flex> <v-select label="Select Province" v-bind:items="listProvince" outline v-model="province" persistent-hint @change="loadCity()"></v-select> 
</v-flex>

and in the 'listProvince' I am getting data and displayed in the dropdown but in console I am getting this error Invalid prop: type check failed for prop "items". Expected Array, got String.

This is the vue js code:

    export default {
  props: ["updateView","newBooking"],

  data() {
    return {
      selected: [0],
      shipper: "",
      address: "",
      barangay: "",
      city: "",
      province: "",
      phone: "",
      listProvince:"",
      selectedCity:"",
      bookingObject: {},
      isNewBk: false,
    };
  }
}

Please help me thanks in advance

I have a dropdown in vue js.

<v-flex> <v-select label="Select Province" v-bind:items="listProvince" outline v-model="province" persistent-hint @change="loadCity()"></v-select> 
</v-flex>

and in the 'listProvince' I am getting data and displayed in the dropdown but in console I am getting this error Invalid prop: type check failed for prop "items". Expected Array, got String.

This is the vue js code:

    export default {
  props: ["updateView","newBooking"],

  data() {
    return {
      selected: [0],
      shipper: "",
      address: "",
      barangay: "",
      city: "",
      province: "",
      phone: "",
      listProvince:"",
      selectedCity:"",
      bookingObject: {},
      isNewBk: false,
    };
  }
}

Please help me thanks in advance

• javascript
• jquery
• vuejs2

Share Improve this question Follow edited Nov 26, 2018 at 4:36 ramees asked Nov 23, 2018 at 9:53 rameesramees 5111 gold badge11 silver badge88 bronze badges 9

• 3 I mean, the error is pretty sefl-explanatory. You're tring to bind a string (province) to something that expects an array (v-bind:items). – Roberto Zvjerković Commented Nov 23, 2018 at 9:59
• where do i declare items as array here? – ramees Commented Nov 23, 2018 at 10:01
• You didn't, which is the problem. – Roberto Zvjerković Commented Nov 23, 2018 at 10:02
• 1 province: "", It should be province: ["something", "something"], – Roberto Zvjerković Commented Nov 23, 2018 at 10:03
• 1 You SHOULDN'T declare it as a string. selectedProvince should be a string, province should be renamed to provinces and it should be an array: ["province1", "province2"] – Roberto Zvjerković Commented Nov 23, 2018 at 10:11

 |  Show 4 more ments

3 Answers 3

Sorted by: Reset to default 1

To plete the answer with an example... example from Vue site:

  props: {
  title: String,
  likes: Number,
  isPublished: Boolean,
  mentIds: Array,
  author: Object,
  callback: Function,
  contactsPromise: Promise // or any other constructor
}

for more info: https://v2.vuejs/v2/guide/ponents-props.html

I got the answer

Here i declared province as string and listProvince as array

Thanks

Incase someone still feel confuse on ramees answer like I did, here is the real example of the final setting

data() {
  return {
    province: "",
    listProvince:['option 1','option 2'],
  };

This declare listProvince as array (the dropdown select options) while province as string (the selected dropdown value).

Hope this provide additional help to someone who needs it!

本文标签：