如何在React中显示来自Django Rest API的图像？

npm install axios

import React, { Component } from 'react';
import axios from 'axios';

class ImageComponent extends Component {
  state = {
    imageUrl: '',
  };

  componentDidMount() {
    axios.get('https://example.com/api/images/1')  // 替换为Django Rest API的URL
      .then(response => {
        this.setState({ imageUrl: response.data.url });
      })
      .catch(error => {
        console.error(error);
      });
  }

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

    return (
      <div>
        {imageUrl && <img src={imageUrl} alt="Image" />}
      </div>
    );
  }
}

export default ImageComponent;