React Native
...
Users
React Native에서 Parse로 현재 사용자 데이터 가져오기
7 분
현재 사용자 가져오기 위한 react native 소개 사용자 등록 및 로그인을 구현한 후, 다양한 작업 및 요청을 수행하기 위해 현재 로그인한 사용자 데이터를 검색해야 합니다 react native는 asyncstorage asyncstorage 를 로컬 저장소로 사용하므로, 이 데이터는 앱의 구성 요소 내에서 parse currentasync parse currentasync 를 사용하여 검색할 수 있습니다 전제 조건 이 튜토리얼을 완료하려면 다음이 필요합니다 react native 앱이 생성되고 back4app에 연결됨 이전 가이드를 완료하여 parse 사용자 클래스에 대한 이해를 높이세요 목표 react native 앱을 위한 parse를 사용하여 현재 사용자 데이터를 가져옵니다 1 현재 사용자 검색 이 방법 parse currentasync parse currentasync 는 앱을 parse와 asyncstorage를 사용하도록 적절히 구성한 후 코드 어디에서나 사용할 수 있습니다 그 응답은 현재 사용자의 객체 ( parse user parse user ) 또는 현재 로그인된 사용자가 없으면 null이 됩니다 javascript 1 const getcurrentuser = async function () { 2 const currentuser = await parse user currentasync(); 3 if (currentuser !== null) { 4 alert alert( 5 'success!', 6 `${currentuser get('username')} is the current user!`, 7 ); 8 } 9 return currentuser; 10 };1 const getcurrentuser = async function () promise\<parse user> { 2 const currentuser parse user = await parse user currentasync(); 3 if (currentuser !== null) { 4 alert alert( 5 'success!', 6 `${currentuser get('username')} is the current user!`, 7 ); 8 } 9 return currentuser; 10 }; 이 방법은 애플리케이션 상태나 사용자 데이터에 접근할 수 없는 상황에서 필수적이며, 앱의 모든 구성 요소에서 관련 parse 요청을 수행할 수 있게 합니다 2 react native 구성 요소에서 현재 사용자 사용하기 이전 가이드에서 parse currentasync parse currentasync 는 테스트와 hellouser hellouser 구성 요소 내에서 이미 사용되었습니다 여기 다시 전체 구성 요소가 있습니다 hellouser js 1 import react, {fc, reactelement, useeffect, usestate} from 'react'; 2 import {text, view} from 'react native'; 3 import parse from 'parse/react native'; 4 import styles from ' /styles'; 5	 6 export const hellouser = () => { 7 // state variable that will hold username value 8 const \[username, setusername] = usestate(''); 9	 10 // useeffect is called after the component is initially rendered and 11 // after every other render 12 useeffect(() => { 13 // since the async method parse user currentasync is needed to 14 // retrieve the current user data, you need to declare an async 15 // function here and call it afterwards 16 async function getcurrentuser() { 17 // this condition ensures that username is updated only if needed 18 if (username === '') { 19 const currentuser = await parse user currentasync(); 20 if (currentuser !== null) { 21 setusername(currentuser getusername()); 22 } 23 } 24 } 25 getcurrentuser(); 26 }, \[username]); 27	 28 // note the conditional operator here, so the "hello" text is only 29 // rendered if there is an username value 30 return ( 31 \<view style={styles login wrapper}> 32 \<view style={styles form}> 33 {username !== '' && \<text>{`hello ${username}!`}\</text>} 34 \</view> 35 \</view> 36 ); 37 }; hellouser tsx 1 import react, {fc, reactelement, useeffect, usestate} from 'react'; 2 import {text, view} from 'react native'; 3 import parse from 'parse/react native'; 4 import styles from ' /styles'; 5	 6 export const hellouser fc<{}> = ({}) reactelement => { 7 // state variable that will hold username value 8 const \[username, setusername] = usestate(''); 9	 10 // useeffect is called after the component is initially rendered and 11 // after every other render 12 useeffect(() => { 13 // since the async method parse user currentasync is needed to 14 // retrieve the current user data, you need to declare an async 15 // function here and call it afterwards 16 async function getcurrentuser() { 17 // this condition ensures that username is updated only if needed 18 if (username === '') { 19 const currentuser = await parse user currentasync(); 20 if (currentuser !== null) { 21 setusername(currentuser getusername()); 22 } 23 } 24 } 25 getcurrentuser(); 26 }, \[username]); 27	 28 // note the conditional operator here, so the "hello" text is only 29 // rendered if there is an username value 30 return ( 31 \<view style={styles login wrapper}> 32 \<view style={styles form}> 33 {username !== '' && \<text>{`hello ${username}!`}\</text>} 34 \</view> 35 \</view> 36 ); 37 }; 이 경우, parse currentasync parse currentasync 메서드는 사용자 이름을 검색하고 컴포넌트 jsx 내에서 렌더링되는 상태 변수를 업데이트합니다 결론 이 가이드의 끝에서, react native에서 로컬 저장소에서 현재 parse 사용자 데이터를 검색하는 방법을 배웠습니다 다음 가이드에서는 사용자가 비밀번호를 재설정할 수 있도록 하는 방법을 보여드리겠습니다