import { ImageUploader } from 'ant-mobile'
const [fileList, setFileList] = useState<ImageUploadItem[]>([]);
const beforeUpload = (files: File[]) => {
return files.filter(file => {
if (file.size > 3 * 1024 * 1024) {
Toast.show('请选择小于 3M 的图片')
return false
}
return true
})
}
// 要求返回一个promise对象
const Upload = async (file: File): Promise<ImageUploadItem> => {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => {
resolve({
url: reader.result as string,
});
};
});
};
return (
<div className={styles.home}>
<Button color="success">按钮</Button>
<ImageUploader
value={fileList}
upload={Upload}
beforeUpload={beforeUpload}
onChange={setFileList} maxCount={5} multiple
/>
</div>
);
ImageUploader的使用
最新推荐文章于 2024-06-03 09:54:25 发布