Advertisement
Guest User

Untitled

a guest
Jan 23rd, 2019
76
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.22 KB | None | 0 0
  1. import React,{Component} from 'react';
  2. import { StyleSheet, Text, FlatList, View, Image } from 'react-native';
  3.  
  4. export default class App extends Component {
  5.  
  6.  
  7. constructor(props){
  8. super(props);
  9. this.state = {
  10.  
  11.  
  12. filmes:[]
  13.  
  14.  
  15.  
  16.  
  17. }
  18.  
  19.  
  20.  
  21. fetch('https://filmespy.herokuapp.com/api/v1/filmes')
  22. .then((response)=>response.json())
  23. .then((json)=>{
  24. let state = this.state;
  25. state.filmes = json.filmes;
  26. this.setState(state);
  27. });
  28.  
  29.  
  30. }
  31.  
  32.  
  33. render() {
  34. return (
  35. <View style={styles.container}>
  36.  
  37. <Text> Teste do bahia</Text>
  38. <FlatList
  39. data={this.state.filmes}
  40. renderItem={({item})=> <Filme data={item} />}
  41. keyExtractor={(item, index)=>item.titulo}
  42. />
  43. </View>
  44. );
  45. }
  46. }
  47.  
  48.  
  49. class Filme extends Component{
  50. render(){
  51. return(
  52. <View style={styles.filmeArea}>
  53. <Image source={{uri:this.props.data.poster}} style={styles.filmeImagem}/>
  54. <View>
  55. <Text>{this.props.data.titulo}</Text>
  56. <Text>{this.props.data.genero}</Text>
  57. </View>
  58. </View>
  59. );
  60. }
  61. }
  62.  
  63. const styles = StyleSheet.create({
  64. container: {
  65. flex: 1,
  66. marginTop:20
  67. },
  68. filmeArea:{
  69. flex:1,
  70. flexDirection:'row'
  71. },
  72. filmeImagem:{
  73. width:80,
  74. height:110
  75. }
  76. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement