Skip to content

Commit 81dc4cb

Browse files
committed
feat: add preventDefault to onTabPress in BottomNavigation
1 parent 5a60eb2 commit 81dc4cb

File tree

1 file changed

+18
-5
lines changed

1 file changed

+18
-5
lines changed

src/components/BottomNavigation.tsx

Lines changed: 18 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,11 @@ type NavigationState = {
3939
routes: Route[];
4040
};
4141

42+
type TabPressEvent = {
43+
defaultPrevented: boolean;
44+
preventDefault(): void;
45+
};
46+
4247
type Props = {
4348
/**
4449
* Whether the shifting style is used, the active tab appears wider and the inactive tabs won't have a label.
@@ -166,7 +171,7 @@ type Props = {
166171
/**
167172
* Function to execute on tab press. It receives the route for the pressed tab, useful for things like scroll to top.
168173
*/
169-
onTabPress?: (props: { route: Route }) => void;
174+
onTabPress?: (props: { route: Route } & TabPressEvent) => void;
170175
/**
171176
* Custom color for icon and label in the active tab.
172177
*/
@@ -542,10 +547,18 @@ class BottomNavigation extends React.Component<Props, State> {
542547
private handleTabPress = (index: number) => {
543548
const { navigationState, onTabPress, onIndexChange } = this.props;
544549

545-
if (onTabPress) {
546-
onTabPress({
547-
route: navigationState.routes[index],
548-
});
550+
const event = {
551+
route: navigationState.routes[index],
552+
defaultPrevented: false,
553+
preventDefault: () => {
554+
event.defaultPrevented = true;
555+
},
556+
};
557+
558+
onTabPress?.(event);
559+
560+
if (event.defaultPrevented) {
561+
return;
549562
}
550563

551564
if (index !== navigationState.index) {

0 commit comments

Comments
 (0)