en-US

The simplest usage.

zh-CN

最简单的用法。

import { DImage } from '@react-devui/ui';

export default function Demo() {
  return (
    <>
      <DImage style={{ height: 100 }} dImgProps={{ src: '/assets/imgs/image-1.jpg', alt: 'demo' }}></DImage>
      <DImage style={{ height: 100 }} dError={<div className="error">Load fail</div>} dImgProps={{ src: 'img.png', alt: 'demo' }}></DImage>
    </>
  );
}

.error {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 250px;
  height: 100px;
  color: var(--rd-color-danger);
  border: 1px solid var(--rd-color-danger);
}