I have a my-component.vue
which sets a prop default
to true
:
const props = defineProps({ modelValue: String, editable: { type: Boolean, default: true } })
I’d assume now that whenever the component is imported and mounted, its editable
prop is set to true
if no no other value is passed as prop but as soon as I pass:
<my-component :editable="false"/>
in any of the parent components, the editable
prop inside my-component
is permanently set to false
in all instances of mounting it.
Is that the desired behaviour of default props
or am I doing something wrong?
Advertisement
Answer
You probably have a bug somewhere, the default prop shouldn’t be overwritten by setting a prop value in a sibling.
As you can see in this example the default value is applied even though one of the siblings has :editable="false"