본문 바로가기

웹 프로그래밍/React Native

오류 정리

네트워크

현상

FormData를 body에 넣어서 AJAX 요청을 보내면 Network error가 발생

 

해결 방법

/android/app/src/main/java/com/${project name}/MainApplication.java - line:47

@Override
  public void onCreate() {
    super.onCreate();
    SoLoader.init(this, /* native exopackage */ false);
    initializeFlipper(this, getReactNativeHost().getReactInstanceManager()); // 주석 처리
  }

안드로이드 스튜디오

현상

Could not read script 'C:\Users\multicampus\Desktop\project\specialization-pjt\s03p23a410\frontend\node_modules\@react-native-community\cli-platform-android\native_modules.gradle' as it does not exist.

 

해결 방법

npm i @react-native-community/cli-platform-android

현상

프로젝트 작업 중에 라이브러리를 설치하면 빌드되지 않음

 

해결방법

1. terminal

node_module에 남아있는 캐시를 지워야 함

라이브러리를 설치하면 해줄 것

npm start --reset-cache

2. gradle 초기화

./gradlew clean //빌드 시 생성된 파일들을 초기화 합니다. android 폴더 안에서 실행 해야함
"async gradle" in Android Studio //gradle의 설정을 로컬과 동기화합니다.

현상

React Native CLI failed to determine Android project configuration. This is likely due to misconfiguration. Config output:
[root:C:\Users\multicampus\Desktop\project\specialization-pjt\s03p23a410\frontend, reactNativePath:C:\Users\multicampus\Desktop\project\specialization-pjt\s03p23a410\frontend\node_modules\react-native, dependencies:[:], commands:[], assets:[], platforms:[:], project:[:]]

 

해결방법

yarn install

 


react-native-image-picker

현상

Couldn't get file path for photo on ANDROID 10

 

해결방법

android 10의 스토리지 보안 정책 때문에 오류가 발생했다. 따라서 이에 대한 접근 권한을 바꿔줘야 한다.

/android/app/src/main/AndroidManifest.xml

<application
	...
	android:requestLegacyExternalStorage="true">
    <activity>
    	...
    </activity>
</application>

react native maximum update depth exceeded

원인

onPress={this.onBtn()}과 같이 함수를 호출하면 바로 렌더링 되자마자 바로 함수를 호출하기 때문에 다시 렌더링 된다. 렌더링이 되면 다시 함수를 호출하므로 무한 반복하게 된다. 반면 onPress={thsi.onBtn}은 함수 호출이 아니므로 무한반복이 일어나지 않는다.

 

해결방법

onPress={() => this.onBtn()}형태로 써야 한다. 또한, map으로 컴포넌트를 다수 렌더링 했을 때, 매개변수로 사용하려면 onPress={() => this.onBtn(i)}로 선언해줘야 한다. 그래야 this.onBtn에서 i를 사용할 수 있다. 만약, arrow function 왼쪽에 매겨변수를 집어넣으면 evenv.target으로 잡히게 되므로 주의해야 한다. 

'웹 프로그래밍 > React Native' 카테고리의 다른 글

Android apk 파일 배포  (0) 2020.10.07
Splash Screen  (0) 2020.10.01
Redux  (0) 2020.09.20
React Navigation  (0) 2020.09.19
Axios vs Fetch  (0) 2020.09.19