react-navigation快速点击会导致多次跳转的问题解决办法

修改react-navigation目录下,scr文件夹中的addNavigationHelpers.js文件

import type {
    NavigationProp,
    NavigationParams,
    NavigationScreenProp,
    NavigationNavigateAction,
} from './TypeDefinition';

import NavigationActions from './NavigationActions';
import invariant from './utils/invariant';

export default function (navigation: NavigationProp): NavigationScreenProp {
    // 添加点击判断
    let debounce = true;
    return {
        ...navigation,
        goBack: (key?: ?string): boolean => {
            let actualizedKey: ?string = key;
            if (key === undefined && navigation.state.key) {
                invariant(
                    typeof navigation.state.key === 'string',
                    'key should be a string'
                );
                actualizedKey = navigation.state.key;
            }
            return navigation.dispatch(
                NavigationActions.back({key: actualizedKey})
            );
        },
        navigate: (routeName: string, params?: NavigationParams, action?: NavigationNavigateAction): boolean => {
            if (debounce) {
                debounce = false;
                navigation.dispatch(
                    NavigationActions.navigate({
                        routeName,
                        params,
                        action,
                    }),
                );
                setTimeout(
                    () => {
                        debounce = true;
                    },
                    500,
                );
                return true;
            }
            return false;
        },
        /**
         * For updating current route params. For example the nav bar title and
         * buttons are based on the route params.
         * This means `setParams` can be used to update nav bar for example.
         */
        setParams: (params: NavigationParams): boolean => {
            invariant(
                navigation.state.key && typeof navigation.state.key === 'string',
                'setParams cannot be called by root navigator'
            );
            const key = navigation.state.key;
            return navigation.dispatch(NavigationActions.setParams({params, key}));
        },
    };
}

你可能感兴趣的:(react-navigation快速点击会导致多次跳转的问题解决办法)