I have a Child component, which displays a warning message if the wrong dates from an Input are selected. This warning should only be possible in the Parent Component, because the Child is re-used throughout my application.
I want to add a v-if to the warning notification, that it can only appear if it's rendered in that exact Parent Component, and not anywhere else the component is re-used. I have tried with V-If, tied to the component name , but that has not solved the issue.
What is the best way to make the child component register that it has been rendered in ParentComponent?
<ChildComponent>
<div>
<b-datepicker
class="datepicker-input"
/>
<b-notification
v-if="this.componentName === 'parentComponent" >
'WARNING, WRONG DATES SELECTED'
</b-notification>
</div>
<ParentComponent>
<div>
<ChildComponent>
</ChildComponent>
</div>
data() {
return {
componentName: this.$options.name,
</ParentComponent>