Check if tab is activve

<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