JAVASCRIPT

react axios request data objest from online json with table element

// this is the component of the GetResponds.js
import React from 'react';
 
import axios from 'axios';

export default class PersonList extends React.Component {
    state = {
        persons: [ 
            

    ]
        
    }
    componentDidMount() {
            axios.get('https://jsonplaceholder.typicode.com/users')
            .then( res => {
                const persons = res.data;
                this.setState({ persons });
            })

    }
    render(){
        return(
            <table>
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Name</th>
                    <th>Username</th>
                    <th>Email</th>
                </tr>
            </thead>
            <tbody>
                {this.state.persons.map((person) =>
                    <tr>
                        <td>{person.id}</td>
                        <td>{person.name}</td>
                        <td>{person.username}</td>
                        <td>{person.email}</td>
                    </tr>)}
            </tbody>
        </table>

        )
    }
}