CODEWITHSUNDEEP
javascriptjqueryvuejs2
ramees
ramees

Reputation: 51

Invalid prop: type check failed for prop "items". Expected Array, got String

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

Upvotes: 4

Views: 25686

Answers (3)

ramees
ramees

Reputation: 51

I got the answer

Here i declared province as string and listProvince as array

Thanks

Upvotes: 1

Steve
Steve

Reputation: 69

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!

Upvotes: 0

Non404
Non404

Reputation: 1293

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

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

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

Upvotes: 1

Related Questions