FlatList_Api.js
Tue May 04 2021 11:49:31 GMT+0000 (Coordinated Universal Time)
Saved by
@arsal
import React, { useState, useEffect, Component } from 'react'
import { View, Text, FlatList, color, ImageBackground,StyleSheet} from 'react-native'
const FlatList_Api = () =>
{
const [APi, Apiupt] = useState()
async function callApi()
{
let resp = await fetch('https://reactnative.dev/movies.json')
let resp_json = await resp.json()
Apiupt(resp_json.movies)
}
useEffect(()=>{
callApi()
})
return (
<View style={styles.container}>
<Text style={{fontSize:40, color:'red'}}>Flat List with API</Text>
<FlatList
// numColumns={2}
data= {APi}
renderItem = {
({item}) =>
<Text style={styles.item}>
{item.title}, {item.releaseYear}
</Text>
}
/>
</View>
)
}
const styles = StyleSheet.create
({
container:
{
flex: 1,
backgroundColor: '#fff',
paddingTop: 10,
paddingHorizontal: 20
},
item:
{
marginTop: 20,
padding: 10,
backgroundColor: 'darkblue',
fontSize:30,
color: 'pink',
// marginHorizontal:20,
// marginTop:40
}
})
export default FlatList_Api
content_copyCOPY
Comments