[英]How to Fetch Data from Firebase Realtime Database in React Native App
How can I fetch data from Firebase Realtime Database using the below method?如何使用以下方法从 Firebase 实时数据库中获取数据? please suggest me.
请建议我。 Thanks for your support I attached here my Realtime Database please check the image link https://i.stack.imgur.com/BagkZ.png
感谢您的支持,我在此处附上了我的实时数据库,请查看图片链接https://i.stack.imgur.com/BagkZ.png
import React, { useEffect, useState, useContext, } from 'react';
import { View, Text, Image, StyleSheet, ScrollView, SafeAreaView, ActivityIndicator, FlatList, } from 'react-native';
export default function App() {
const [isLoading, setLoading] = useState(true);
const [data, setData] = useState([]);
const getMovies = async () => {
try {
const response = await fetch('https://reactnative.dev/movies.json');
const json = await response.json();
setData(json.movies);
} catch (error) {
console.error(error);
} finally {
setLoading(false);
}
}
useEffect(() => {
getMovies();
}, [])
return (
<View style={{ backgroundColor: theme.viewOne, }}>
{isLoading ? <ActivityIndicator /> : (
<FlatList
ListHeaderComponent={
<Image source={require('./AllImage/qq2.jpg')}
style={{ width: "auto", height: 150, resizeMode: "cover", }} />
}
data={data}
keyExtractor={({ id }, index) => id}
renderItem={({ item }) => (
<View style={styles.container}>
<View style={styles.item}>
<Text style={styles.mainText}>{item.title}</Text>
</View>
<View style={styles.item}>
<Text style={styles.mainText}>{item.releaseYear}</Text>
</View>
</View>
)}
/>
)}
</View>
);
};
Rahul for react-native you can implement it like this instead of using async-await.对于 react-native 的 Rahul,您可以像这样实现它,而不是使用 async-await。 You need to connect your app to database like this -
您需要像这样将您的应用程序连接到数据库 -
import { firebase } from '@react-native-firebase/database';
const reference = firebase
.app()
.database('https://<databaseName>.<region>.firebasedatabase.app/')
.ref('/users/123');
Then you can perform read-write transactions like this -然后你可以像这样执行读写事务 -
import database from '@react-native-firebase/database';
database()
.ref('/users/123')
.once('value')
.then(snapshot => {
console.log('User data: ', snapshot.val());
});
The article has a detailed implementation and you can choose to persist data easily as well.这篇文章有一个详细的实现,你也可以选择轻松地持久化数据。 Hope it helps!
希望能帮助到你!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.