반응형 React Native18 [React Native] 리액트 네이티브 비동기 서버 통신 axios 사용법 리액트 네이티브에서 비동기로 서버와 통신하는 방법중에 axios에 대해 알아보자. 비동기 서버 통신 API인 axios는 아래와 같은 형식으로 사용할 수 있다. import axios from 'axios'; axios.post('localhost:8080/api/login', { ID: "id", PASSWORD: "password" }) .then(result=>{ if(result){ Alert.alert('', '로그인 되었습니다.', [{text: '확인'}]); } }) .catch(function(error){ console.log('login catch error : '+JSON.stringify(error)); }) post 방식으로 localhost:8080/api/login 서버에 아.. 2023. 8. 23. [React Native] 리액트 네이티브 달력 날짜 사용하기 - DateTimePickerModal 리액트 네이티브에서 달력 컴포넌트를 사용하여 날짜를 선택할 수 있는 기능을 구현하기 위해 DateTimePickerModal을 사용한 예제이다. # 라이브러리 설치하기 npm install -save react-native-image-picker npm install -save react-native-community/datetimepicker # DateTimePickerModal 컴포넌트 사용하기 import {View, StyleSheet, Pressable} from 'react-native'; import DateTimePickerModal from 'react-native-modal-datetime-picker'; import {ko} from 'date-fns/locale'; import {.. 2023. 8. 14. [React Native] 이미지 업로드 하기 - 갤러리, 사진첩 이미지 리액트 네이티브로 앱을 구현할 때, 스마트폰에 있는 이미지를 업로드하는 기능이 필요한 경우 사용할 수 있는 launchImageLibrary에 대해 알아보겠습니다. (안드로이드 기준) # 먼저 launchImageLibrary를 사용하기 위해 라이브러리를 설정합니다. import {launchImageLibrary} from 'react-native-image-picker'; # 이미지를 불러오기 위한 버튼을 만들어 주고 onSelectImage()} > 이미지 추가하기 const styles = StyleSheet.create({ img: { height: 120, width: 120, marginTop: 20, marginBottom: 20, alignSelf: 'center', }, }); # 이미.. 2023. 7. 31. [React Native] 리액트 네이티브 AsyncStorage 앱 종료해도 데이터 유지하기 앱 개발을 할 때, 앱 실행중에 데이터를 유지하는 방법이 여러가지가 있는데 앱을 종료했을때에도 데이터를 유지할 수 있는 방법이 있다. AsyncStorage를 사용하는 방법인데 앱 실행시에 로그인 유무 체크에도 활용할 수 있어 유용하며 아래와 같이 사용할 수 있다. # AsyncStorage import 하기 import AsyncStorage from "@react-native-async-storage/async-storage"; # AsyncStorage 데이터 저장하기 AsyncStorage.setItem('sampleData', JSON.stringify({'sampleId':id}), () => { console.log('AsyncStorage setItem'); }); # AsyncStora.. 2023. 6. 16. 이전 1 2 3 4 5 다음 반응형