본문 바로가기

ReactNative14

리액트 네이티브 StackNavigation을 이용한 새로고침 공식문서 https://reactnavigation.org/docs/navigation-prop/#dispatch reactnavigation.org https://reactnavigation.org/docs/stack-actions/#replace reactnavigation.org 내가 사용한 방법 import { StackActions } from '@react-navigation/native'; navigation.dispatch(StackActions.replace('url', params)); 2022. 8. 21.
리액트 네이티브 에뮬 업그레이드 후 에러 에뮬 업그레이드 하겠냐는 친절한 expo 생각없이 업데이트 하니 에러가 났다... babel.config.js에 해당 코드를 추가하니 해결됐다. 2022. 8. 17.
리액트 네이티브 AdMob 전면광고 import { setTestDeviceIDAsync, AdMobBanner, AdMobInterstitial, PublisherBanner, AdMobRewarded } from 'expo-ads-admob'; useEffect(()=>{ //안드로이드와 IOS 각각 광고 준비 키가 다르기 때문에 디바이스 성격에 따라 다르게 초기화 시켜줘야 합니다. Platform.OS === 'ios' ? AdMobInterstitial.setAdUnitID("키값") : AdMobInterstitial.setAdUnitID("키값") //유용한 속성들 //로딩된후 AdMobInterstitial.addEventListener("interstitialDidLoad", () => console.log("intersti.. 2022. 8. 15.
리액트 네이티브 AdMob 공식문서 Admob - Expo Documentation Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React. docs.expo.dev 엑스포 에드몹 설치 expo install expo-ads-admob 에드몹에서 앱ID 가져오기 app.json에 에드몹 앱ID정보 넣기 app.json { "expo":{ . . ., "ios":{ . . ., "config":{ "googleMobileAdsAppId": "앱ID" } }, "android":{ . . ., "config":{ "googleMobileAdsAppId": "앱ID" } } }.. 2022. 8. 15.
리액트 네이티브 refresh 공식문서 https://reactnavigation.org/docs/stack-actions/ reactnavigation.org import { StackActions } from '@react-navigation/native'; navigation.dispatch(StackActions.replace('url', 인자값)); 2022. 8. 15.
리액트 네이티브 reload 공식문서 DevSettings · React Native The DevSettings module exposes methods for customizing settings for developers in development. reactnative.dev reload() static reload() 예제 DevSettings.reload()} /> 내가 사용한 방법 import {DevSettings} from 'react-native' DevSettings.reload(); //메인 페이지로 리로드됨 2022. 8. 14.
리액트 네이티브 useState 기본 사용 const [변수명, set변수명] = useState([]); useState의 기존 데이터 + 새로운 데이터 const [test, setTest] = useState(['기존정보']); setTest((prevState) =>{ return ['새정보', ...prevState]; }); //test //['새정보','기존정보'] 기존 데이터가 무겁고 계속 새로운 데이터를 넣을경우 const havyWork () =>{ return ['무거운데이터']; } const [test, setTest] = useState(() => { return havyWork(); } setTest((prevState) => { return ['새로운정보', ...prevState]; } //test 처음에.. 2022. 8. 13.
리액트 네이티브 firebase 설치후 idb오류 서버접속 에러 파이어베이스가 업데이트 되면서 파일을 cjs로 되돌려주는데 해당 파일을 받을수 있는 컴포넌트(resolver)가 없어서 발생한 오류 루트 폴더에 metro.config.js 라는 파일을 만들기 module.exports = { transformer: { getTransformOptions: async () => ({ transform: { experimentalImportSupport: false, inlineRequires: false, }, }), }, resolver: { sourceExts: ['jsx', 'js', 'ts', 'tsx', 'cjs', 'fs'], }, }; 2022. 8. 11.
날씨정보 가져오기 Weather API 서버가 제공하는 도메인 형식의 API를 사용하려면, 사용을 위한 도구가 필요합니다. 이를 axios 라고 부릅니다. yarn add axios axios 설치 import axios from "axios" axios 임포트 const getLocation = async () => { //수많은 로직중에 에러가 발생하면 //해당 에러를 포착하여 로직을 멈추고,에러를 해결하기 위한 catch 영역 로직이 실행 try { //자바스크립트 함수의 실행순서를 고정하기 위해 쓰는 async,await await Location.requestForegroundPermissionsAsync(); const locationData= await Location.getCurrentPositionAsync(); console.. 2022. 8. 6.