FileReader怎样一次读取多个文件?

发布于 2022-09-05 00:48:00 字数 233 浏览 12 评论 0

<input type="file" name="sendfile" id="sendfile" v-show='false' accept="image/png,image/gif,image/jpeg" @change='upload' multiple>

如上,一个支持多图片上传的input,怎么用filereader本地读取出每个图片的dataurl?这个upload该怎么写?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

心头的小情儿 2022-09-12 00:48:00

循环读取啊

new Vue({
  el: 'app',
  methods: {
    async upload () {
      const files = event.target.files
      const uploadList = []
      console.log(files)

      const readFileAsync = file => new Promise(resolve => {
        const reader = new FileReader()
        reader.onload = evt => resolve(evt.target.result)
        reader.readAsDataURL(file)
      })

      for (let i = 0; i < files.length; i++) {
        uploadList.push(await readFileAsync(files[i]))
      }

      event.target.value = null

      console.log(uploadList)
    }
  }
})
燕归巢 2022-09-12 00:48:00

这个答案是要用vue.js吧

其他js,比如jQuery行吧?

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文