0
@Leo is correct; essentially you are trying to call the removeTab
method in your child, but the method is defined on your parent. The child does not have access to the methods on the parent directly.
In order to get your example working, since your parent will likely be managing the tabs, you will want to emit an event from your tabs and listen for the event in your parent.
<button class="item" v-on:click="$emit('remove-tab')">{{tab.nomeTab}} <div >remove</div></button>
And in the parent template
<tab v-for ="tab in tabs" :key="tab" :tab="tab" @remove-tab="removeTab"></tab>
And here is your fiddle fixed.
Not also I added a key
to your v-for
. You should always use a key
with v-for
.
0
Vue has isolated scope. You have v-on:click="removeTab()"
in the template of your tab component, but itβs not defined within the component.
Source:stackexchange.com