我使用 v-tabs,我想知道:当我更改选项卡时,我如何知道选项卡 ID?
这是我的代码:
<v-tabs class="tabs-container" color="green" grow>
<v-tab class="tab"
v-for="tab of tabs"
:key="tab.id"
:title=tab>
{{tab.name}}
</v-tab>
<v-tabs-items>
<v-tab-item v-for="tab in tabs" :key="tab.id">
<div v-if='tab.id == 0'>
<CreateHero v-on:updateAllTabs="updateAllTabs"/>
</div>
<div v-else>
<HeroPresenter/>
</div>
</v-tab-item>
</v-tabs-items>
</v-tabs>
...
methods: {
updateAllTabs() {
axios.get('/hero').then(responce => {
this.tabs = responce.data
})
},
getHero(id) {
this.$emit("getCurrentHero", id);
}
}
因此,当单击选项卡时,我想在 HeroPresenter 组件中发送选项卡 ID。我尝试使用 $emit,但是我应该在 v-tab 中写什么??我的 vue 组件 HeroPresenter 订阅了“getCurrentHero”
最佳答案
您可以添加一个点击事件,它将调用您的函数
<v-tab class="tab"
v-for="tab of tabs"
:key="tab.id"
:title=tab
@click="getHero(tab.id)"
>
关于vue.js - vuetify 更改选项卡事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56559044/