怎么预览图片？
- 通过
<input type="file">选择文件</input>标签来选择预览图片文件，得到的是FileList对象，此时并不能预览 - 在 FileList 中取得一个 File 对象，此时也不能预览
- new FileReader，执行readAsDataURL()方法，生成Data URL,设置到img 标签上即可预览
const reader = new FileReader()
reader.onloadend = () => {
console.log(reader.result)
}
reader.readAsDataURL(File)
怎么上传图片？
- 怎么上传文件就怎么上传图片
- 可以上传DataURL么，要看你们后台是否支持
- 如果是图片已经是DataURL，调用文件上传接口，转成Blob类型，随便添加一个 filename就行了，没有必要转成File
Blob，FileList，File，FileReader关系
- FileList对象中包含一组File对象
- File对象继承Blob，拥有 size属性，slice方法，自身拥有name，type等属性
- FileReader 读取File对象，调用readAsDataBinaryString 可以转换成 Blob对象，上面我们转换成的是 Data URL,为了方便预览
Q1：什么是Data URL，和Base64 区别
emmmm,怎么说呢，这两个本质无联系，Base64是一直编码格式
DataURL定义规则data:[<mediatype>][;base64],<data>其中Base64编码格式不是必须的,详细定义可以查阅[www.ietf.org/rfc/rfc2397…][DataURL方案]
我们常说的 Base64 Image 其实是指 mediatype 为 "images/*"的 Data URL。
Q2：已经是DataURL上传图片是，为什么不需要转成File在上传
文件上传API传输的是Blob对象，可以查查 DataURL 转 Blob 和 File却别（是不是就差一个filename）
Q3：如果上传图片不支持DataURL，而是Blob，预览时又转成 DataURL格式，转来转去
emmmm，好问题 要不和你们后端好好商量一下，支持一下DataURL格式 要不通过 window.URL.createObjectURL(blob | file)方式创建预览，这样也能统一
