It is not clear to me if it is possible in a tabview to have a clickable 'X' on every tab label in order to be able to dynamically close the tab.
I've tried using something like (see below) this but when I Click on 'X' button 2 events are generated:
- the click on the button
- the selection of the tab
these 2 events interphere in some way and produce some strange effect.
I was looking if somethin very simpler is already available in inthe TabView/TabPanel component itself.
Thanks!
Cheers
<TabView v-model:activeIndex="active" closable="true">
<TabPanel v-for="(tab, index) in tabs" :key="tab.title">
<template #header>
<i class="pi pi-calendar"></i>
<span>{{ tab.title }}</span>
<Button @click="onClick(index)">X</Button>
</template>
<component v-bind:is="tab.content" />
</TabPanel>
</TabView>
Ho to make tabs closable in a tabview
-
- Information
-
Who is online
Users browsing this forum: No registered users and 7 guests