Behandeln fehlerhafter Bild-URLs mit einem onError-Fallback-Zustand

import { useState } from 'react';
 
export function AvatarImage({ src }) {
  const [hasError, setHasError] = useState(false);
  const fallbackSrc = '/images/placeholder.png';
 
  return (
    <img
      src={hasError ? fallbackSrc : src}
      alt="User profile"
      onError={() => setHasError(true)}
    />
  );
}