뎁스_59f720f37

뎁스_59f720f37

부산소프트웨어마이스터고

hi

프론트엔드
뎁스_59f720f37뎁스_59f720f37· 26일

질문React Native Navigation오류

import React from 'react'; import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; import { NavigationContainer } from '@react-navigation/native'; import Map from './src/pages/Map'; import Pronunciation from './src/pages/Pronunciation'; import HomeScreen from './src/pages/HomeScreen'; import IsRecord from './src/pages/IsRecord'; import Footer from './src/components/footer'; type TabParamList = { Map: undefined; Prosecutor: undefined; Home: undefined; Recorded: undefined; Profile: undefined; }; const Tab = createBottomTabNavigator<TabParamList>(); export default function App() { return ( <NavigationContainer> <Tab.Navigator screenOptions={{ headerShown: false }}> <Tab.Screen name="Map" component={Map} /> <Tab.Screen name="Prosecutor" component={Pronunciation} /> <Tab.Screen name="Home" component={HomeScreen} /> <Tab.Screen name="Recorded" component={IsRecord} /> <Tab.Screen name="Profile" component={Pronunciation} /> </Tab.Navigator> {/* <Footer /> */} </NavigationContainer> ); } import React from 'react'; import { BottomTabNavigationProp } from '@react-navigation/bottom-tabs'; import { useNavigation } from '@react-navigation/native'; import Home from '@/src/assets/images/icons/Home' import Map from '@/src/assets/images/icons/Maping' import Prosecutor from '@/src/assets/images/icons/Prosecutor' import Recorded from '@/src/assets/images/icons/Recorded' import Profile from '@/src/assets/images/icons/Profile' import styled from 'styled-components/native'; type TabParamList = { Map: undefined; Prosecutor: undefined; Home: undefined; Recorded: undefined; Profile: undefined; }; export default function Footer() { const navigation = useNavigation<BottomTabNavigationProp<TabParamList>>(); return ( <FooterContainer> <FooterBar> <FooterButton onPress={() => navigation.navigate('Map')} activeOpacity={0.6}> <IconWrapper> <Map /> </IconWrapper> <FooterText>의료기관</FooterText> </FooterButton> <FooterButton onPress={() => navigation.navigate('Prosecutor')} activeOpacity={0.6}> <IconWrapper> <Prosecutor /> </IconWrapper> <FooterText>검사</FooterText> </FooterButton> <FooterButton onPress={() => navigation.navigate('Home')} activeOpacity={0.6}> <IconWrapper> <Home /> </IconWrapper> <FooterText>홈</FooterText> </FooterButton> <FooterButton onPress={() => navigation.navigate('Recorded')} activeOpacity={0.6}> <IconWrapper> <Recorded /> </IconWrapper> <FooterText>기록</FooterText> </FooterButton> <FooterButton onPress={() => navigation.navigate('Profile')} activeOpacity={0.6}> <IconWrapper> <Profile /> </IconWrapper> <FooterText>프로필</FooterText> </FooterButton> </FooterBar> </FooterContainer> ); } const FooterContainer = styled.View` position: absolute; bottom: 0; width: 100%; background-color: white; padding: 12px 0; border-radius: 25px 25px 0 0; box-shadow: 0px -4px 20px rgba(0, 0, 0, 0.6); /* rgba 제일 끝에꺼가 그림자 짙게하는거 */ elevation: 5; `; const FooterBar = styled.View` width: 98%; flex-direction: row; justify-content: space-around; padding: 1%; `; const FooterButton = styled.TouchableOpacity` align-items: center; `; const IconWrapper = styled.View` width: 24px; height: 24px; align-items: center; justify-content: center; `; const FooterText = styled.Text` color:rgb(0, 0, 0); font-weight: 500; `;이렇게 연결을 했는데..  (NOBRIDGE) ERROR The action 'NAVIGATE' with payload {"name":"Home"} was not handled by any navigator. Do you have a route named 'Home'? This is a development-only warning and won't be shown in production.계속 이러한 오류가 떠요..
402
1
0
닥터핸
닥터핸·2025-03-06
해당 오류 "(NOBRIDGE) ERROR The action 'NAVIGATE' with payload {"name":"Home"} was not handled by any navigator." 는 주어진 TabParamList 에 정의된 name 과 실제 Tab.Screen 에서 사용한 name이 일치하지 않아서 발생할 가능성이 높습니다.현재 TabPa...