Make links in
expo-router
's
Tabs
use
replace
instead of the default
push
.
Currently there is no way to provide this option so it ends up in the final
Link
's props.
Current working workaround:
export const HrefReplaceLinkButton = (props: BottomTabBarButtonProps) => {
// Copied what is in /expo-router/build/layouts/TabsClient.js
const children = Platform.OS === 'web' ? props.children : <Pressable>{props.children}</Pressable>;
return (
<Link
{...(props as any)}
style={[{ display: 'flex' }, props.style]}
href={props.href}
replace
asChild={Platform.OS !== 'web'}>
{children}
</Link>
);
};
and then
<Tabs.Screen
options={{
tabBarButton: HrefReplaceLinkButton,
}}
/>