[Vuejs]-Vue Prop default() function returns the Object as a String instead of an Object

0👍

You haven’t shared the code where you are calling this component in the parent, but this error is most likely happening there. I assume currently, your code in the parent looks like this:

<ChildComponent action-options="{columnLabel: 'Actions'}" />

This means that the prop is being passed as a string. If you want to send it as an object you should change it to:

<ChildComponent :action-options="{columnLabel: 'Actions'}" />

This way Vue knows it’s a JavaScript object and not a string. Read More

If this doesn’t solve the problem, please share the other parts of your both components.

Leave a comment