Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

When tapping the TabBar to navigate, muiltiple onTabChange are called #430

Open
gregavola opened this issue Jul 5, 2024 · 4 comments
Open
Labels
question Further information is requested

Comments

@gregavola
Copy link

gregavola commented Jul 5, 2024

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.

@gregavola gregavola added the question Further information is requested label Jul 5, 2024
@MusabDev
Copy link

MusabDev commented Jul 8, 2024

+1

@gregavola
Copy link
Author

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

@farasatkhan
Copy link

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
Copy link

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!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested
Projects
None yet
Development

No branches or pull requests

4 participants