File 文件在 img 中显示。

js 从本地抉择的文件 file，在 img 中展现

1. 形式一：

    const windowURL = window.URL || window.webkitURL;
    const src = windowURL.createObjectURL(_file);
    // 返回一个 url，就能够间接放在 img 的 src 中渲染了。// 然而该 url 对象会始终存在在 document 对象中，只有当 document 卸载时（敞开窗口）才会开释这个内存。// 所以，最好在你不须要的时候，被动开释。开释形式如下：windowURL.revokeObjectURL(src);

2. 形式二 (也是获取文件 base64 的办法)：

    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => {
      const src = reader.result;
      // 这里的 reader.result 就是文件的 base64 了。如果是图片的话，就能够间接放到 src 中展现了
    };

形式一（createObjectURL）和形式二（readAsDataURL）的区别

次要区别

• 次要区别：通过 URL.createObjectURL(blob) 能够获取以后文件的一个内存 URL
• 通过 FileReader.readAsDataURL(file) 能够获取一段 data:base64 的字符串

执行机会：

• createObjectURL 是同步执行（立刻的）
• FileReader.readAsDataURL 是异步执行（过一段时间）

内存应用：

• createObjectURL 返回一段带 hash 的 url，并且始终存储在内存中，直到 document 触发了被卸载或者执行 revokeObjectURL 来开释。
• FileReader.readAsDataURL 则返回蕴含很多字符的 base64，并会比 blob url 耗费更多内存，然而在不必的时候会主动从内存中革除（通过垃圾回收机制）

兼容性方面两个属性都兼容 ie10 以上的浏览器。