Spaces:
Running
Running
| import React, { useEffect, useState } from 'react'; | |
| import { View, Text, FlatList } from 'react-native'; | |
| import { getSimplePrice } from '../services/market'; | |
| export default function HomeScreen() { | |
| const [prices, setPrices] = useState<any>({}); | |
| useEffect(() => { | |
| (async () => { | |
| try { | |
| const data = await getSimplePrice(['bitcoin','ethereum']); | |
| setPrices(data); | |
| } catch (e) { | |
| console.error(e); | |
| } | |
| })(); | |
| }, []); | |
| return ( | |
| <View style={{flex:1, padding:20}}> | |
| <Text style={{fontSize:20}}>Crypto Prices</Text> | |
| <FlatList | |
| data={Object.keys(prices)} | |
| keyExtractor={(i) => i} | |
| renderItem={({item}) => ( | |
| <View style={{padding:12, borderBottomWidth:1, borderColor:'#eee'}}> | |
| <Text style={{fontSize:16}}>{item.toUpperCase()}</Text> | |
| <Text>USD: {prices[item]?.usd}</Text> | |
| <Text>24h: {prices[item]?.usd_24h_change?.toFixed(2)}%</Text> | |
| </View> | |
| )} | |
| /> | |
| </View> | |
| ); | |
| } | |