지니네 231

REACT-NATIVE - 스택 내비게이션에 props값 넘기는 법

✔️ 사용 방법 //stacknavigaiton 있는 곳! const [token ,setToken] = useState("") {return }}/> //Login.tsx interface Props { setToken: Dispatch; token: string; } function Login ({setToken, token} : Props){ return ( 로그인 페이지 :{toekn} ) } export default Login; props로 값을 넘길 때 타입 스크립트에서는 항상 받아온 props의 값을 선언해주는 것을 잊으면 안 된다!

FE/REACT_NATIVE 2022.08.12

TypeScript에러 - useRef에러!

(property) React.ClassAttributes.ref?: React.LegacyRef | undefined 이 호출과 일치하는 오버로드가 없습니다. 오버로드 1/2('(props: ScrollViewProps | Readonly): ScrollView')에서 다음 오류가 발생했습니다. 'MutableRefObject' 형식은 'LegacyRef | undefined' 형식에 할당할 수 없습니다. 'MutableRefObject' 형식은 'RefObject' 형식에 할당할 수 없습니다. 'current' 속성의 형식이 호환되지 않습니다. 'undefined' 형식은 'ScrollView | null' 형식에 할당할 수 없습니다. 오버로드 2/2('(props: ScrollViewProps, c..

FE/에러노트 2022.08.12

RN에러 - AsyncStorage에러 - Failed to delete storage directory

잘만 삭제 되던 AsyncStorage.clear(); 에서 갑자기 오류가 생겼다 ✔️ 해결 방안 먼저 기존코드는 단순히 AsyncStorage.clear() 를 활용해서 클리어했는데 이 부분을 아래와 같이 바꿔주면 해결됨 import AsyncStorage from '@react-native-async-storage/async-storage'; const KEY = 'key'; const Storage = { async get() { const data = await AsyncStorage.getItem(KEY); if (!data) return null; return JSON.parse(data ?? ''); }, async set(data) { await AsyncStorage.setItem(KEY..

FE/에러노트 2022.08.10

REACT-NATIVE-imagePicker

권한 얻기 $ yarn add react-native-permissions ios/Podfile permissions_path = '../node_modules/react-native-permissions/ios' //카메라 pod 'Permission-Camera', :path => "#{permissions_path}/Camera" //위치 정확하게 가져오기(베터리 소모량 많음) pod 'Permission-LocationAccuracy', :path => "#{permissions_path}/LocationAccuracy" //위치 항상 가져오기 pod 'Permission-LocationAlways', :path => "#{permissions_path}/LocationAlways" //위치 사용..

FE/REACT_NATIVE 2022.08.02

REACT-NATIVE - ios font적용하기 -

1. 원하는 폰트를 다운로드한다 2. (확실하지 않지만) /ios/fonts를 만들고 폰트 파일을 다 넣어준다. 3. src/assets/fonts를 만들고 적용할 폰트 폰트를 전부 다 넣어준다 4. 제일 상위에서 react-native.config.js 파일을 만들어준다 module.exports = { project: { ios: {}, android: {}, }, assets: ["./src/assets/fonts"], }; 5. /ios/프로젝트파일/info.plist파일 수정 작업에 들어간다. UIAppFonts IBMPlexSansKR-Bold.ttf IBMPlexSansKR-Medium.ttf IBMPlexSansKR-ExtraLight.ttf IBMPlexSansKR-Light.ttf IB..

FE/REACT_NATIVE 2022.07.28

REACT-NATIVE- custom tab bar

https://maruzzing.github.io/study/rnative/React-Native-%EC%BB%A4%EC%8A%A4%ED%85%80-%ED%83%AD-%EB%B0%94-%EB%84%A4%EB%B9%84%EC%BC%80%EC%9D%B4%EC%85%98-%EB%A7%8C%EB%93%A4%EA%B8%B0/ React Native 커스텀 탭 바 네비케이션 만들기 React Navigation을 이용하여 Top Tab Bar를 커스텀 하는 방법을 알아보자. maruzzing.github.io https://velog.io/@blacksooooo/React-native-nested-navigation-bottom-tab-modal-%EC%A0%81%EC%9A%A9%ED%95%98%EA%B8%B0-n..

FE/REACT_NATIVE 2022.07.19

REACT-NATIVE - pickerSelect

https://taehoon95.tistory.com/116 [React Native] PickerSelect 사용하기 (datepicker) 개요 앱에서 picker는 사용자의 입력값을 개발자가 제시함으로써 입력에 대한 오류를 줄일 수 있는 방법입니다. 저는 개인 프로젝트를 진행하면서 2가지의 PickerSelect가 필요했습니다. 이 블로그에 taehoon95.tistory.com https://github.com/mmazzarolo/react-native-modal-datetime-picker GitHub - mmazzarolo/react-native-modal-datetime-picker: A React-Native datetime-picker for Android and iOS A React-N..

FE/REACT_NATIVE 2022.07.14