0
import React, { Component } from 'react';
import api from '../service/api';
import {View ,Text, StyleSheet, Image, FlatList, Dialog} from 'react-native';
import Cabecalho from '../components/Cabecalho';
export default class Tarefa extends Component {
constructor(props) {
super(props)
this.state = {
loading: true,
listaItem: {},
item: props.navigation.state.params.tarefa
}
}
componentDidMount() {
this.loadProducts();
}
loadProducts = async () => {
const response = await api.get("/tarefa/" + this.state.item);
this.setState({ listaItem: response.data });
};
render() {
return (
<View style={estilos.container}>
<Text>{this.state.listaItem.cidade} - {this.state.listaItem.bairro}</Text>
<Image source={require('../img/012345.png')} style={estilos.logo}/>
<Image source={require('../img/-IPb7Whg.png')} style={estilos.estrela}/>
<Text>{this.state.listaItem.titulo}</Text>
<Text>{this.state.listaItem.texto}</Text>
</View>
);
}
}
I’m trying to put Porto Alegre up there, what I have at the moment is figure 1 and I’m trying to turn into figure 2.
I tried some alternatives like:
static navigationOptions = {
title: {this.state.listaItem.cidade} - {this.state.listaItem.bairro},
};
but I was struck by the following error: Can not read Property 'listitem' of Undefined
tried as well:
static navigationOptions = {
title: this.state && this.state.listaItem ? `${this.state.listaItem.cidade} - ${this.state.listaItem.bairro}` : '',
};
and
import _ from 'lodash';
...
static navigationOptions = {
title: `${_.get(this, 'state.listaItem.cidade', '')} - ${_.get(this, 'state.listaItem.bairro', '')}`
};
these last two do not give error but also do not present
For now I can not use since the navigation, only returning the value of the other screen, the values of this screen are loaded in: loadProducts = async () => ' const Response = await api.get("/task/" + this.state.item); this.setState({ listItem: Response.data }); };
– Felipe Santos