<f7-link tab-link="#view-home" tab-link-active>
<Icon icon="ion:home-outline" height="32"/>
<Icon icon="ion:home" height="32" />
</f7-link>
I have 2 types of icons in my tab-link: outline & filled.
how can i switch from one to an other when tab-link is active ?
the active tab has a class
.tab-link-active
so you can check that and switch the icons
<f7-link tab-link="#view-home" tab-link-active>
<Icon icon="ion:home-outline" height="32" v-if='isTabActive'/>
<Icon icon="ion:home" height="32" v-else/>
</f7-link>
isTabActive () {
return this.$refs.myNiceTab.$el.classList.contains('tab-link-active')
}
this its just an example, change the code to your needs