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>
      );
  }
}

Figura 1 inserir a descrição da imagem aqui

Figura 2 inserir a descrição da imagem aqui

Estou tentando colocar o Porto alegre ali em cima, o que eu tenho no momento eh a figura 1 e estou tentando transformar na figura 2.

Tentei algumas alternativas como:

static navigationOptions = {
title: {this.state.listaItem.cidade} - {this.state.listaItem.bairro},
};

mas me apareceu o seguinte erro: Can not read property 'listItem' of undefined

tentei tambem:

static navigationOptions = {
  title: this.state && this.state.listaItem ? `${this.state.listaItem.cidade} - ${this.state.listaItem.bairro}` : '',
};

e

import _ from 'lodash';
...
static navigationOptions = {
  title: `${_.get(this, 'state.listaItem.cidade', '')} - ${_.get(this, 'state.listaItem.bairro', '')}`
};

esses dois ultimos nao dao erro mas tambem nao aprece

1 Resposta 1

0

O navigationOptions pode ser utilizado também como função:

 static navigationOptions = ({navigation}) => {
        const {state} = navigation;
        return {
          title: state.listaItem 
                 ? `{this.state.listaItem.cidade} - {this.state.listaItem.bairro}` 
                 : '',
        };
      };
1
  • Por enquanto não consigo usar visto que o navigation, só esta retornando o valor da outra tela, os valores desta tela sao carregados no: loadProducts = async () => { const response = await api.get("/tarefa/" + this.state.item); this.setState({ listaItem: response.data }); }; Commented 8/03/2019 às 13:44

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .