data populated into auction page

parent 45a523fd
import React from 'react'; import React, { useEffect, useState } from 'react';
import {View, StyleSheet, Text, ScrollView} from 'react-native'; import axios from 'axios';
import {View, StyleSheet, Text, ScrollView, Image} from 'react-native';
import { AppAuctionItem } from '../components/auction_item.component'; import { AppAuctionItem } from '../components/auction_item.component';
import { AppContainer } from '../container/container'; import { AppContainer } from '../container/container';
import themeColors from '../assets/colors'; import themeColors from '../assets/colors';
import { AuctionBottomTab } from '../Navigations/AuctionBottomTab'; import { AuctionBottomTab } from '../Navigations/AuctionBottomTab';
const HomeAuctionScreen = ({navigation}) => { const HomeAuctionScreen = ({navigation}) => {
const [auctions, setAuctions] = useState([]);
useEffect(() => {
axios.get("http://localhost:5000/auctions")
.then( async function (response) {
setAuctions(response.data);
})
.catch(function (error) {
console.log(error);
})
}, [])
return ( return (
<View style={styles.container}> <View style={styles.container}>
<View style={styles.header}/> <View style={styles.header}>
<Image source={require('../assets/splash1.png')} style={styles.images}></Image>
</View>
<AppContainer> <AppContainer>
<Text style={styles.auctionHeading}>Auctions List</Text> <Text style={styles.auctionHeading}>Auctions List</Text>
<ScrollView> <ScrollView>
<View> <View>
<AppAuctionItem label='Auction Item 1' onPress = {() => navigation.navigate("AuctionDetailScreen")}/> {auctions.map((auction) => {
<AppAuctionItem label='Auction Item 2'/> return(
<AppAuctionItem label='Auction Item 3'/> <AppAuctionItem label={auction.name} onPress = {() => navigation.navigate("AuctionDetailScreen")}/>
<AppAuctionItem label='Auction Item 4'/> )
})}
</View> </View>
</ScrollView> </ScrollView>
</AppContainer> </AppContainer>
...@@ -39,6 +54,11 @@ const styles = StyleSheet.create({ ...@@ -39,6 +54,11 @@ const styles = StyleSheet.create({
btnRowContainer: { btnRowContainer: {
maxHeight: 100 maxHeight: 100
}, },
images: {
flex: 1,
width: 400,
resizeMode: 'cover',
},
contentContainer: { contentContainer: {
flex: 1, flex: 1,
flexDirection: 'row', flexDirection: 'row',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment