onerror触发时如何替换镜像。react js

import React, { useState } from 'react';

function ImageComponent({ src, fallbackSrc }) {
  const [imageSrc, setImageSrc] = useState(src);

  const handleImageError = () => {
    setImageSrc(fallbackSrc);
  };

  return (
    <img src={imageSrc} onError={handleImageError} alt="Description" />
  );
}

export default ImageComponent;

import React from 'react';
import ReactDOM from 'react-dom';
import ImageComponent from './ImageComponent';

const App = () => {
  return (
    <div>
      <h1>图片加载示例</h1>
      <ImageComponent
        src="https://example.com/primary-image.jpg"
        fallbackSrc="https://example.com/fallback-image.jpg"
      />
    </div>
  );
};

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