When tapping the TabBar to navigate, muiltiple onTabChange are called

[gregavola]

If you have Tab A, Tab B, Tab C and Tab D and the user starts on Tab A and taps Tab D, the onTabChange (and onIndexChange) event will fire for B,C and D, as it "swipes" through the panes. Anyone know how to prevent the swipe animation or just load the tab without animation to prevent this from happening? This is important for analytics capture, as it would fire an track for a view that wasn't actually seen.

[MusabDev]

+1

[gregavola]

Is this repo actively maintained? I'm happy to help - just would love some guidance here.

[farasatkhan]

I've found a workaround for it for now.

import _ from 'lodash';
import { IndexChangeEventData } from 'react-native-collapsible-tab-view/lib/typescript/src/types';

const switchScreens = useCallback((properties: IndexChangeEventData<string>) => {
    console.log(properties);
}, []);

const debouncedSwitchScreens = _.debounce(switchScreens, 300);

<Tabs.Container
    ...
    onTabChange = {(properties) => {
     debouncedSwitchScreens(properties)
    }}
>

[rsuubinn]

I've found a workaround for it for now.

import _ from 'lodash';
import { IndexChangeEventData } from 'react-native-collapsible-tab-view/lib/typescript/src/types';

const switchScreens = useCallback((properties: IndexChangeEventData<string>) => {
    console.log(properties);
}, []);

const debouncedSwitchScreens = _.debounce(switchScreens, 300);

<Tabs.Container
    ...
    onTabChange = {(properties) => {
     debouncedSwitchScreens(properties)
    }}
>

It totally helped me. Thank you!