如何在React中显示来自django-rest-framework的错误消息

import axios from 'axios';

class MyComponent extends React.Component {
  state = {
    errorMessage: null
  };

  fetchData = () => {
    axios.get('http://your-django-api-endpoint')
      .then(response => {
        // 处理成功响应
      })
      .catch(error => {
        if (error.response) {
          // 请求已发送，但服务器返回错误响应
          this.setState({ errorMessage: error.response.data.detail });
        } else if (error.request) {
          // 请求已发送但没有收到响应
          console.log(error.request);
        } else {
          // 发送请求时发生错误
          console.log('Error', error.message);
        }
      });
  };

  render() {
    const { errorMessage } = this.state;

    return (
      <div>
        {errorMessage && <p>{errorMessage}</p>}
        <button onClick={this.fetchData}>获取数据</button>
      </div>
    );
  }
}