API calling using axios and passing data to component

import React, { Component } from 'react';
import { render } from 'react-dom';
import PersonList from './PersonList';
import './style.css';
import axios from "axios";

class App extends Component {
  state = {
    persons: []
  };
  componentDidMount() {
    axios.get("https://jsonplaceholder.typicode.com/users").then(res => {
      this.setState({
        persons: res.data
      });
    });
  }
  render() {
    return (
      <div>
        <PersonList persons={this.state.persons} />
      </div>
    );
  }
}

render(<App />, document.getElementById('root'));

import React from "react";

export default class PersonList extends React.Component {
  render() {
    return (
      <div>
        <ul>
          {this.props.persons.map(item => (
            <li key={item.name}>{item.name}</li>
          ))}
        </ul>
      </div>
    );
  }
}