diff --git a/app/(tabs)/_layout.tsx b/app/(tabs)/_layout.tsx index bd37ee7..1a01b31 100644 --- a/app/(tabs)/_layout.tsx +++ b/app/(tabs)/_layout.tsx @@ -1,3 +1,4 @@ +import AskNavbar from '@/components/layout/ask'; import { TabBarIcon } from '@/components/navigation/TabBarIcon'; import { requestNotificationPermission } from '@/components/owner/utils'; import TabBarBackground from '@/components/ui/TabBarBackground'; @@ -186,18 +187,7 @@ export default function TabLayout() { return ( <> , - }} + tabBar={props => } > {/* 落地页 */} { setIsLoading(true); checkAuthStatus(router, () => { - router.replace('/ask') + router.replace('/memo-list') }, false).then(() => { setIsLoading(false); }).catch(() => { diff --git a/components/layout/ask.tsx b/components/layout/ask.tsx index 12c8623..d6dca7c 100644 --- a/components/layout/ask.tsx +++ b/components/layout/ask.tsx @@ -3,8 +3,9 @@ import ChatNotInSvg from "@/assets/icons/svg/chatNotIn.svg"; import PersonInSvg from "@/assets/icons/svg/personIn.svg"; import PersonNotInSvg from "@/assets/icons/svg/personNotIn.svg"; import { WebSocketStatus } from "@/lib/websocket-util"; -import { router, usePathname } from "expo-router"; -import React, { useCallback, useMemo } from 'react'; +import { BottomTabBarProps } from "@react-navigation/bottom-tabs"; +import { router } from "expo-router"; +import React, { useMemo } from 'react'; import { Dimensions, Image, StyleSheet, TouchableOpacity, View } from 'react-native'; import Svg, { Circle, Ellipse, G, Mask, Path, Rect } from "react-native-svg"; @@ -42,14 +43,15 @@ const CenterButtonSvg = React.memo(() => ( )); -interface AskNavbarProps { +type AskNavbarProps = BottomTabBarProps & { wsStatus: WebSocketStatus; -} +}; -const AskNavbar = ({ wsStatus }: AskNavbarProps) => { +const AskNavbar = ({ state, descriptors, navigation, wsStatus }: AskNavbarProps) => { // 获取设备尺寸 const { width } = useMemo(() => Dimensions.get('window'), []); - const pathname = usePathname(); + const { routes, index } = state; + const currentRouteName = routes[index].name; const statusColor = useMemo(() => { switch (wsStatus) { @@ -64,34 +66,6 @@ const AskNavbar = ({ wsStatus }: AskNavbarProps) => { } }, [wsStatus]); - // 预加载目标页面 - // useEffect(() => { - // const preloadPages = async () => { - // try { - // await Promise.all([ - // router.prefetch('/memo-list'), - // router.prefetch('/ask'), - // router.prefetch('/owner') - // ]); - // } catch (error) { - // console.warn('预加载页面失败:', error); - // } - // }; - // preloadPages(); - // }, []); - - // 使用 useCallback 缓存导航函数 - const navigateTo = useCallback((route: string) => { - if (route === '/ask') { - router.push({ - pathname: '/ask', - params: { newSession: "true" } - }); - } else { - router.push(route as any); - } - }, []); - // 使用 useMemo 缓存样式对象 const styles = useMemo(() => StyleSheet.create({ container: { @@ -156,7 +130,7 @@ const AskNavbar = ({ wsStatus }: AskNavbarProps) => { }), [width, statusColor]); // 如果当前路径是ask页面,则不渲染导航栏 - if (pathname != '/memo-list' && pathname != '/owner') { + if (currentRouteName !== 'memo-list' && currentRouteName !== 'owner') { return null; } @@ -165,18 +139,18 @@ const AskNavbar = ({ wsStatus }: AskNavbarProps) => { navigateTo('/memo-list')} + onPress={() => navigation.navigate('memo-list')} style={[styles.navButton, { alignItems: "flex-start", paddingLeft: 16 }]} > navigateTo('/ask')} + onPress={() => router.push({ pathname: '/ask', params: { newSession: "true" } })} style={styles.centerButton} > @@ -184,11 +158,11 @@ const AskNavbar = ({ wsStatus }: AskNavbarProps) => { navigateTo('/owner')} + onPress={() => navigation.navigate('owner')} style={styles.navButton} >