Fórum Erro no projeto react TypeError: Cannot read property map of undefined #599322

20/12/2018

Olá estou tentando criar uma lista com dados da fake api jsonplaceholder mas não consigo resolver esse erro.
Gostaria de uma ajuda.

import React, { Component } from "react";
import { teste } from "../base/base";
 
class Corpo extends Component {
    constructor(props) {
        super(props)
        this.state = {
                id : 0,
                name: 0,
                username: 0,
                email: 0,
                address: {
                    street: 0,
                    city: 0  
            }
        };
    }
    componentDidMount() {
        teste().then(users => this.setState());
    }
 
    render() {
        return (
            <div>
                <div className="row">
                    <div className="col">
                        <div className="card mt-2">
                            <div className="card-header">
                                Pessoas
                        </div>
                            <table class="table">
                                <thead>
                                    <tr>
                                        <th ></th>
                                        <th >Nome</th>
                                        <th >Username</th>
                                        <th >Email</th>
                                        <th >Rua</th>
                                        <th >Cidade</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {
                                        this.state.users.map((item,indice) => {
                                            return (
                                                <tr key= >
                                                    <td>{item.name}</td>
                                                    <td>{item.username}</td>
                                                    <td>{item.email}</td>
                                                    <td>{item.address.street}</td>
                                                    <td>{item.address.city}</td>     
                                                </tr>
                                            )
                                        })
                                    }   
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        )
    }
}
export default Corpo;

Carlos Santos

Curtir tópico

+ 0

Responder

Post mais votado

20/12/2018

Acabei conseguindo arrumar o erro e pegar os dados da api...
[quote}this.state = {
users : []
}

componentDidMount() {
teste().then(dados => this.setState(users:dados));
}

Carlos Santos

Responder

Gostei + 2