如何在react.js中使用来自数据库的内联图像源？

import React, { Component } from 'react';

class ImageComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      imageData: null
    };
  }

  componentDidMount() {
    // 在这里获取数据库中的图像数据，可以使用Ajax请求或其他方式
    // 假设获取到的数据是一个URL
    const imageUrl = 'https://example.com/image.jpg';

    // 更新组件状态，将图像数据存储在state中
    this.setState({
      imageData: imageUrl
    });
  }

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

    return (
      <div>
        {/* 使用<img>标签展示图像 */}
        <img src={imageData} alt="Database Image" />

        {/* 使用CSS的background-image属性展示图像 */}
        <div style={{ backgroundImage: `url(${imageData})` }}></div>
      </div>
    );
  }
}

export default ImageComponent;