React, page out/remove events never fired

I’m using a tabbar with some View as Tab tabs.
I need to unbind some events that I attach at page(of the tab) load but i can’t find the way to do that.
The first approach was to look in direction of the classical react way but I notice that componentDidMount was fired for all tabs at first load and componentWillUnmount is never called, I think everthing will be destroyed only at the “ends” of the app, is this correct?

Anyway, i searched in the docs (a bit confusing in my opinion) and I found various events, but none of them work.
This is my code, HOME page is the content for a TAB:

       return (
           <Page name="home"
               onPageAfterIn={this.afterIn.bind(this)} <-- fired
               onPageAfterOut={this.beforeOut.bind(this)} <-- never fired
               onPageBeforeOut={this.beforeOut.bind(this)} <-- never fired
               onPageBeforeRemove={this.beforeOut.bind(this)} <-- never fired
               onPageBeforeUnmount={this.beforeOut.bind(this)} <-- never fired
               onTabShow={this.tabShow.bind(this)}  <-- never fired
               >
               <Navbar title="Home Page" />

           </Page>
       );
   }

If you expect it to be triggered when you switch tabs, then no. It is only for navigation between pages within same View. If you need it to be triggered when you switch tabs, then use Tab’s tab:show, tab:hide events https://framework7.io/docs/tabs.html#tabs-events

Ok, so I should bind the event where the tab is declared and not where the content is, so not in the Page component, it’s correct?
In my opinion this violate the principle of single responsibility and limitates the component reusability.

Is this the only way?

Moving the declaration inside the component I’m now capable to handle tab events inside the tab component.
The only side effect is that now the tab is not routable, it is correct?

render() {
    return (
        <View id="view-home" main tab onTabShow={this.tabShow.bind(this)} >
            <Page name="home">
                <Navbar title="About" backLink="Back" />

            </Page>
        </View>
    );
}

Now this.tabShow is called correctly.

Thanks.