inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

배달앱 클론코딩 [with React Native]

내 위치 가져오기(geolocation)

Ing component navigation type error

해결된 질문

255

김영욱

작성한 질문수 21

0

Ing 컴포넌트의 네비게이션 타입을 강좌에 나온대로 진행하였더니 타입에러가 발생해서 문의글 남깁니다.

컴포넌트 하단부 도착 마커의 navigation.push("Complete", {}); 에서 push 관련된 타입에러가 발생하였습니다.

Property 'push' does not exist on type 'NavigationProp

라는 에러메세지가 발생하였는데요.

우선 아래의 사진과 같이 navigation의 타입을 재선언 해주면서 해결이 되었습니다.

LoggedInParamList 대신에 생성한 IngScreenPorps를 넣어봤으면 push에 대한 에러는 해결되지만 complete라는 네비게이션을 찾지 못한다는 에러가 발생하여 위와같이 해결했는데 옳바른 해결책인지 궁금해서 문의 드립니다!

 

그리고 추가로console.dir 을 활용하려고 하면

TS2339: Property 'dir' does not exist on type 'Console'.

위와 같은 에러가 발생하는데 이건 해결책이 없을까요? 혼자 찾아보려고 했으나 찾지를 못하여 문의드립니다.

react-native

답변 1

0

제로초(조현영)

NativeStackScreenProps를 NativeStackNavigationProp로 바꾸신 것인데 버전차이같기도 합니다. 제 강좌 버전에서는 문제 없었습니다.

애초에 navigation이 NativeStackNavigationProp이라 push가 없을 리가 없습니다.

export type NativeStackScreenProps<
  ParamList extends ParamListBase,
  RouteName extends keyof ParamList = string,
  NavigatorID extends string | undefined = undefined
> = {
  navigation: NativeStackNavigationProp<ParamList, RouteName, NavigatorID>;
  route: RouteProp<ParamList, RouteName>;
};

console.dir는 @types/node를 설치하면 될 것 같습니다.

0

김영욱

답변 감사합니다!


우선 제가 잘못된 정보를 드려 죄송합니다 ㅠ

보니까 navigation을 구조분해를 안해서 push에 에러가 생기는거였습니다.

 

그외에 다른 이슈가 있는데
1. node types 디펜던시를 추가해도 console.dir에 관련된 에러가 동일하게 계속 발생하는데 이런경우 포기하는 수 밖에 없을까요?
2. Ing 컴포넌트를 호출하는 호출부의 component 부부에서 에러가 발생하는데 해결책을 못찾겠습니다.
TS2322: Type '({ navigation }: IngScreenProps) => JSX.Element' is not assignable to type 'ScreenComponentType<ParamListBase, "Ing"> | undefined'.   Type '({ navigation }: IngScreenProps) => JSX.Element' is not assignable to type 'FunctionComponent<{}>'.     Types of parameters '__0' and 'props' are incompatible.       Type '{}' is missing the following properties from type 'IngScreenProps': navigation, route

혹시 좋은 해결책이 없을까요?

0

제로초(조현영)

console.log를 먼저 적으시고 log에서 타입 정의로 이동할 때 어떤 파일로 이동하나요?

아래 에러는 https://www.inflearn.com/questions/651242 여기에 임홍진님 댓글에 따라서 useNavigation으로 변경해서 수정하시면 됩니다.

0

김영욱

image위와같이 react-native의 index로 갑니다!
dir을 쓰고 찍어보면
image
위와같이 dir이 있는곳으로 가기는 하지만 에러메세지는 계속 나오구요

아래 방법은 시도해보겠습니다!

앱실행시 네이버맵 [401] 에러

0

993

2

스타일링 라이브러리

0

148

2

expo, cli 선택 중에 고민이 있습니다.

0

167

2

JDK 버전이 달라도 괜찮나요?

0

225

2

dimenstion usewindowdeminstion

0

121

3

[맥 전용]환경 설정하기 1편 & [맥 전용]환경 설정하기 2편의 영상이 안나옵니다.

0

211

1

jdk11 버전과 gradle 버전의 호환성 관련 질문드립니다.

0

400

2

강의 외 질문입니다!

0

157

2

react native랑 맞는 ui 라이브러리 어떤게 좋을까요?

0

1504

2

react native와 spring boot 연결

0

356

1

java가 아닌 .kt에서 code push 에러가 발생합니다.

0

215

2

flipper 239 에러가 발생합니다.

0

165

2

package.json에 /lib/panino.js 문제입니다.

0

470

2

window - mac 협업 과정 질문합니다

0

215

1

ios 빌드 중 RCTBridgeDelegate.h import 오류

0

289

2

ios 앱 빌드 중 hermesEnabled 관련 오류발생

0

240

2

Socket 연결시 질문 드립니다.!

0

152

2

wifi 환경에서 axios 통신이 로컬서버에서 안됩니다.

0

427

2

iOS render error 질문드립니다.

0

410

2

iOS 가상머신 오류

0

166

2

npc react init 명령어 실행시 발생되는 오류

0

220

1

nom start 시 오류

0

116

1

NextJS 기반으로 만들어서 웹뷰 React Native로 배포 가능한가요?

0

1002

2

안드로이드 rn75 버전에 맞게 설정 중에 android13 다운로드에 대해서 막혔습니다!

0

184

2