antdesign-mobile 图片选择器ImagePicker反写

今天遇见一个问题，是把base64数据重新反写倒ImagePicker中，稍微研究了一下

首先需要先把base64进行转换。

// base64 to file
const dataURLtoFile = dataurl => {let binary = atob(dataurl.split(',')[1]let mime = dataurl.split(',')[0].match(/:(.*?);/[1])let array = []for(let i = 0; i < binary.length; i++) {array.push(binary.charCodeAt(i))}let fileData = new Blob([new Unit8Array(array)], { type: mime })let file = new File([fileData], `${new Date().getTime}.png`, { type: mime })return file
}

然后需要分析ImagePicker所需要的数据格式，再进行赋值。

const [imgs, setImgs] = useState([]) // imgs ImagePicker的files绑定的值
// 根据传来的base64进行反写
useEffect(() => {let imgs = []if(props.imgs[0]) {let base64 = 'data:image/jpeg;base64,' + props.imgs[0]let file = dataURLtoFile(base64)let data = {file,orientation: 1,url: base64}imgs.push(data)}setImgs(imgs)
}, [])

这样基本上就解决了，程序员下班！

antdesign-mobile 图片选择器ImagePicker反写相关推荐

react antd-mobile v2图片选择器ImagePicker压缩图片上传腾讯云COS处理方案
本文介绍:react移动端 antd-mobile V2版本使用图片选择器 ImagePicker时,前端压缩图片并且上传腾讯云COS 如果不上传腾讯云,纯选择压缩,可查看:antd-mobile-v ...
Android-如何开发一个功能强大的图片选择器
图片选择器是Android开发中会经常用到的一个功能,特别对于社交类的应用,比如头像设置,比如发图片.自然ImagePicker的轮子很多,今天介绍一个功能强大的轮子SImagePicker 介绍首 ...
小红书图片剪裁框架+微信图片选择器+超高清大图预览+图片自定义比例剪裁，支持 UI 自定义、支持跨进程回调
YImagePicker 项目地址:yangpeixing/YImagePicker 简介: 小红书图片剪裁框架+微信图片选择器+超高清大图预览+图片自定义比例剪裁,支持 UI 自定义.支持跨进程回调 ...
集小红书图片剪裁+微信图片选择器+自定义图片剪裁于一体的YImagePicker
目录关于YImagePicker 引入依赖核心原理效果图集点击查看详细API文档微信图片选择小红书图片选择预览拍照拍摄视频调用选择器并剪裁拍照并剪裁直接剪裁提供媒体数据--支 ...
Android 超高仿微信图片选择器图片该这么加载
2019独角兽企业重金招聘Python工程师标准>>> 转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/39943 ...
Android 仿微信图片选择器 PictureSelector3.0 的使用
在做项目时经常会遇到图片选着,选择单张图片还好,但类似于微信发朋友圈时可以多图选择的时候,就有点手足无措.然后在网上看了很多类似的项目,也尝试过将他们用于自己的项目,比如知乎开源图片选择库 Mati ...
React Native - 使用图片选择器react-native-image-picker拍照、选照片
http://www.hangge.com/blog/cache/detail_1617.html React Native - 使用图片选择器react-native-image-picker拍照. ...
android 自定义相册选择,Android图片选择器，支持拍照、从相册选择、裁剪、自定义主题...
在很多项目中都会用到图片选择器,比如在选择头像的时候,还会要求选择图片进行裁剪后再进行上传:而有的项目要支持拍照后进行图片裁剪再进行上传.由于Android系统兼容性问题,我们不得不考虑自己实现图片裁 ...
Android 超高仿微信图片选择器
出处: http://blog.csdn.net/lmj623565791/article/details/39943731 1.概述关于手机图片加载器,在当今像素随随便便破千万的时代,一张图片占据 ...

antdesign-mobile 图片选择器ImagePicker反写

antdesign-mobile 图片选择器ImagePicker反写相关推荐

最新文章

热门文章