Resolved
Written on
·
41
0
현재 문제(또는 에러)와 코드(또는 github)를 첨부해주세요.
맥/윈도우, 안드로이드/iOS, ReactNative, Node 버전 등의 개발환경을 함께 적어주시면 도움이 됩니다.
에러메세지는 일부분이 아닌 전체 상황을 올려주세요. (
일부만 자르거나 복사하지말아주세요.)
개발환경/코드에 대한 정보가 없을경우 답변이 어렵습니다.
다음의 코드에서
<Stack.Screen
name={feedNavigations.FEED_HOME}
component={FeedHomeScreen}
options={({navigation}) => ({
headerTitle: '피드',
headerLeft: () => FeedHomeHeaderLeft(navigation),
})}
/>
FeedHomeHeaderLeft(navigation)
부분에 navigation이 에러가 나는데
에러는 다음과 같습니다.
Argument of type 'StackNavigationProp<FeedStackParamList, "FeedHome", undefined>' is not assignable to parameter of type 'FeedHomeHeaderLeftProps'.
Type 'Omit<NavigationHelpersCommon<FeedStackParamList, StackNavigationState<FeedStackParamList>>, "getParent"> & { ...; } & EventConsumer<...> & PrivateValueStore<...> & StackActionHelpers<...>' is missing the following properties from type 'Omit<Omit<NavigationHelpersCommon<FeedStackParamList, StackNavigationState<FeedStackParamList>>, "getParent"> & ... 9 more ... & { ...; }, "getParent" | ... 13 more ... | keyof EventConsumer<...>>': jumpTo, openDrawer, closeDrawer, toggleDrawerts(2345)
(parameter) navigation: StackNavigationProp<FeedStackParamList, "FeedHome", undefined>
FeedHomeHeaderLeft.tsx 에서
type FeedHomeHeaderLeftProps = CompositeNavigationProp<
StackNavigationProp<FeedStackParamList>,
DrawerNavigationProp<MainDrawerParamList>
>;
function FeedHomeHeaderLeft(navigation: FeedHomeHeaderLeftProps) {
return (
<HeaderButton
icon={<Ionicons name="menu" color={colors.BLACK} size={25} />}
onPress={() => navigation.openDrawer()}
/>
);
}
요렇게 되어있는데 넘겨받는 파라미터랑 넘겨주는 쪽이 맞지않아서... 그런거 같은데..
강의 6강 듣고있는 중이구요... 도저히 해결이 안되서 질문드립니다.
무엇이 잘못된걸까요?? 선생님 github 소스내려받아도 저는 navigation 저부분이 계속 빨간줄 쳐지면서 에러가 발생합니다..
새해 복 많이 받으세요.
Answer 3
0
아.. 강의에서는 항상 최신버전으로 설치하는 방식으로 알려주다보니.. 저처럼 지금 듣는 수강생들은
중간중간에도 버전맞춘다고... 고생을 했는데 이번에도 버전 문제였네요
기존에는 밑에것들이 전부다 7버전이었는데 다음과 같이 6버전으로 바꾸니 정상동작 합니다.
강의때도 일반적은 설치방식보다 버전을 fix해서 하는 방식을 알려주셨으면 조금더 나중에 듣는 수강생들도 좋지 않을까 생각됩니다.
yarn add @react-navigation/native@6
yarn add @react-navigation/drawer@6
yarn add @react-navigation/stack@6
0
AI 답변으로는 해결이 되지 않습니다. 구글링이며.. ChatGPT며.. 어떤 원인을 말하는지는 알겠는데..
기반지식 부족때문일까요...
선생님 코드와 동일한데.. 선생님은 왜.. 에러없이 넘어갔는지.. 궁금하네요.. 전계속 에러가 발생해서 넘어가지를 못하고있습니다.
0
안녕하세요, 인프런 AI 인턴입니다. sevenfingersstudio님.
질문하신 내용을 바탕으로, FeedHomeHeaderLeft
의 navigation
파라미터와 타입 불일치 문제를 해결하기 위해 몇 가지 확인해야 할 사항이 있습니다.
현재 문제는 CompositeNavigationProp
를 활용해서 두 개의 네비게이터 타입을 결합하여 사용하는데, 타입이 맞지 않아서 발생하는 것으로 보입니다. FeedHomeHeaderLeft
에서 기대하는 CompositeNavigationProp
타입과 실제 전달되는 StackNavigationProp
타입이 맞지 않는 것이 원인입니다.
Navigation 타입 확인 및 수정:
Navigation
타입을 명확히 맞춰 주시기 바랍니다. FeedHomeHeaderLeft
에서는 CompositeNavigationProp
를 타입으로 받고 있으므로 이와 맞추도록 수정해야 합니다.options
에서 전달되는 navigation
은 StackNavigationProp
입니다. FeedHomeHeaderLeft
에서 받을 때는 CompositeNavigationProp
로 받도록 설정해야 합니다.타입스크립트 에러 해결:
navigation
인자의 타입을 FeedHomeHeaderLeft
에서 기대하는 타입으로 적절하게 수정하십시오.StackNavigationProp
에 맞추어 변경해야 할 수도 있습니다.다음은 코드를 예시로 수정하는 방법입니다:
type CompositeNavigationProps = CompositeNavigationProp<
StackNavigationProp<FeedStackParamList, 'FeedHome'>,
DrawerNavigationProp<MainDrawerParamList>
>;
function FeedHomeHeaderLeft(navigation: CompositeNavigationProps) {
return (
<HeaderButton
icon={<Ionicons name="menu" color={colors.BLACK} size={25} />}
onPress={() => navigation.openDrawer()}
/>
);
}
이렇게 변경하면 FeedHomeHeaderLeft
가 제대로 된 CompositeNavigationProp
의 타입을 받을 수 있습니다.
관련 문제에 대한 다른 유사한 질문들을 참조하면 추가적인 도움을 받을 수 있습니다:
문제가 해결되지 않거나 추가적인 설명이 필요하시면, 질문을 조금 더 구체적으로 올려주시면 좋겠습니다. 저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.