Evolução do Código

1class UserProfile extends React.Component {
2  constructor(props) {
3    super(props)
4    this.state = {
5      user: null,
6      loading: true,
7      error: null
8    }
9  }
10 
11  componentDidMount() {
12    fetch('/api/user/' + this.props.id)
13      .then(res => res.json())
14      .then(data => {
15        this.setState({ user: data, loading: false })
16      })
17      .catch(err => {
18        this.setState({ error: err, loading: false })
19      })
20  }
21 
22  componentDidUpdate(prevProps) {
23    if (prevProps.id !== this.props.id) {
24      this.setState({ loading: true })
25      fetch('/api/user/' + this.props.id)
26        .then(res => res.json())
27        .then(data => {
28          this.setState({ user: data, loading: false })
29        })
30    }
31  }
32 
33  render() {
34    if (this.state.loading) return <p>Loading...</p>
35    if (this.state.error) return <p>Error!</p>
36    return <div>{this.state.user.name}</div>
37  }
38}