-
[스파르타코딩클럽] 앱개발 종합반 - 4주차 개발일지스파르타 국비지원 2022. 11. 27. 23:07
firebase 를 이용해 data.json으로 관리하던 데이터를 실시간으로 조회, 추가, 삭제해볼 수 있었다.
import React, { useState, useEffect } from 'react'; import { ScrollView, Text, StyleSheet, Platform } from 'react-native'; import LikeCard from '../components/LikeCard'; import Loading from '../components/Loading'; import * as Application from 'expo-application'; const isIOS = Platform.OS === 'ios'; import { firebase_db } from '../firebaseConfig'; export default function LikePage({ navigation, route }) { const [tip, setTip] = useState([]); const [ready, setReady] = useState(true); useEffect(() => { navigation.setOptions({ title: '꿀팁 찜', }); getLike(); }, []); const getLike = async () => { let userUniqueId; if (isIOS) { let iosId = await Application.getIosIdForVendorAsync(); userUniqueId = iosId; } else { userUniqueId = await Application.androidId; } console.log(userUniqueId); firebase_db .ref('/like/' + userUniqueId) .once('value') .then((snapshot) => { console.log('파이어베이스에서 데이터 가져왔습니다!!'); let tip = snapshot.val(); let tip_list = Object.values(tip); if (tip_list && tip_list.length > 0) { setTip(tip_list); setReady(false); } }); }; return ( <ScrollView style={styles.container}> {tip.map((content, i) => { // LikeCard에서 꿀팀 상태 데이터(==tip)과 꿀팁 상태 데이터를 변경하기 위한 // 상태 변경 함수(== setTip)을 건네준다. //즉 자기 자신이 아닌, 자식 컴포넌트에서도 부모의 상태를 변경할 수 있다. return <LikeCard key={i} content={content} navigation={navigation} tip={tip} setTip={setTip} />; })} </ScrollView> ); } const styles = StyleSheet.create({ container: { backgroundColor: '#fff', }, });
'스파르타 국비지원' 카테고리의 다른 글
[스파르타코딩클럽] 앱개발 종합반 - 5주차 개발일지 (0) 2022.12.01 [스파르타코딩클럽] 웹개발 종합반 - 3주차 개발일지 (0) 2022.11.30 [스파르타코딩클럽] 앱개발 종합반 - 3주차 개발일지 (0) 2022.11.26 [스파르타코딩클럽] 웹개발 종합반 - 2주차 개발일지 (0) 2022.11.26 [스파르타코딩클럽] 웹개발 종합반 - 1주차 개발일지 (0) 2022.11.25