search

vuematerial / vue-material

Vue.js Framework - ready-to-use Vue components with Material Design, free forever.
https://www.creative-tim.com/vuematerial
MIT License
9.88k stars 1.16k forks source link

Invalid prop: type check failed for prop "value" md-select #2296

Closed abhimanusharma closed 3 years ago

abhimanusharma commented 3 years ago

I need both the id and path of the document.

Here is my code:

<md-select name="role" id="role" v-model="selectedDocument">
    <md-option :value="document" v-for="document in documents" :key="document.id">{{document.name}}</md-option>
    <md-option v-if="documents.length <= 0" disabled>There are no documents</md-option>
</md-select>
[Vue warn]: Invalid prop: type check failed for prop "value". Expected String, Number, Boolean, got Object 

found in

---> <MdOption> at src/components/MdField/MdSelect/MdOption.vue
       <MdList> at src/components/MdList/MdList.vue
abhimanusharma commented 3 years ago

Putting it here so if anyone else run into this issue.

I am using JSON.stringify and JSON.parse to convert the object into string and vise versa to ignore this error. This can also be done by traversing through the array of objects to get the object by matching the id or some unique key.

I like the former one. Closing this on the note to enhance this issue.