-
Notifications
You must be signed in to change notification settings - Fork 0
/
App.tsx
77 lines (69 loc) · 2.19 KB
/
App.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
import { StatusBar } from 'expo-status-bar';
import {
SafeAreaView, ScrollView,
Text,
TouchableOpacity,
Alert,
TextInput,
View
} from 'react-native';
import styles from './src/styles/style';
import React, { Component, Fragment, useEffect, useState, useCallback } from 'react';
import FilmsItem from './src/components/filmsItem/filmsItem';
import colors from './src/styles/colors';
import moment, { locale } from 'moment';
export default function App({ route, navigation }) {
const [films, setFilms] = useState([]);
const fetchFilms = useCallback(async () => {
try {
const res = await fetch('https://swapi.dev/api/films/');
const data = await res.json();
//console.log(data.results);
setFilms(data.results)
} catch (error) {
console.log(error);
}
}, []);
useEffect(() => {
fetchFilms();
}, []);
//console.log(films)
/* <View style={styles.container}>
<Text >Titulo:{film.title}</Text>
<Text >Sinopse:{film.opening_crawl}</Text>
<Text >Diretor:{film.director}</Text>
<Text >Produção:{film.producer}</Text>
</View> */
return (
<Fragment>
<SafeAreaView >
<StatusBar backgroundColor={colors.green} />
<View style={styles.container}>
<View style={styles.containerBorderScroll}>
<View style={styles.containerPrincipal}>
<Text style={styles.title}>Filmes</Text>
</View>
<ScrollView style={styles.containerScroll}>
{films.map(film => {
return (
<View key={film.episode_id}>
<FilmsItem
title={film.title}
diretor={film.director}
production={film.producer}
data={moment(film.release_date).format('DD/MM/yyyy')}
onPress={() => {
navigation.navigate('ProductDetails', films);
}}
/>
</View>
);
})
}
</ScrollView>
</View>
</View>
</SafeAreaView>
</Fragment>
);
}