memos/web/src/components/Image.tsx
Zhou Yunliang 91a61e058a
feat: view all images of a memo (#393)
* feat: view all images of a memo

* fix: function arguments

* refactor: unified image preview

* refactor: image preview for resource dialog

Co-authored-by: XQ <qiaobingxue1998@163.com>
2022-11-02 12:00:28 +00:00

24 lines
554 B
TypeScript

import showPreviewImageDialog from "./PreviewImageDialog";
import "../less/image.less";
interface Props {
imgUrls: string[];
index: number;
className?: string;
}
const Image: React.FC<Props> = (props: Props) => {
const { className, imgUrls, index } = props;
const handleImageClick = () => {
showPreviewImageDialog(imgUrls, index);
};
return (
<div className={"image-container " + className} onClick={handleImageClick}>
<img src={imgUrls[index]} decoding="async" loading="lazy" />
</div>
);
};
export default Image;