提交 9a673350 authored 作者: 钟是志's avatar 钟是志

图片预览组件修改

上级 30f56a10
import React from 'react';
import { useMemo } from 'react';
import Viewer from 'react-viewer';
import { checkIsImage } from '@/webPublic/one_stop_public/libs/UploadCom';
export const ImgViewer = (props) => {
const { onClose, path } = props;
const images = useMemo(
() => {
return props?.images?.filter(i => checkIsImage(i?.src));
},
[props.images]
);
const activeIndex = useMemo(
() => {
if(path) {
return images?.findIndex((item) => item?.src === path);
}
return 0
},
[path]
);
return (
<Viewer visible={true} onClose={onClose} activeIndex={activeIndex} images={images} />
);
export const ImgViewer = props => {
const { onClose, path } = props;
const images = useMemo(() => {
if (props.images && Array.isArray(props.images)) {
return props.images.filter(i => checkIsImage(i.src));
} else {
return [path];
}
}, [props.images]);
console.log('images', images);
const activeIndex = useMemo(() => {
if (path && images.length) {
return images?.findIndex(item => item?.src === path);
}
return 0;
}, [path]);
return <Viewer visible={true}
onClose={onClose}
activeIndex={activeIndex}
images={images}
/>;
};
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论