Javascript Base64 Encoding Function Returns Undefined

Question

I am attempting to add Base64 encoded images to a string array. Using a file input form created with react-bootstrap's FormControl:

Solution 1:

No value is returned from getBase64 function synchronously from within an event handler which provides results asynchronously. FileReader loadend event returns results asynchronously. You can use Promise.all() or async/await to get value returned asynchronously from getBase64() function call

Baca Juga

class ReadFiles {
  constructor() {}
  async addImage(event) {
    const newArr = [];
    for (let i = 0; i < event.target.files.length; i++) {
      newArr.push(
        await this.getBase64(event.target.files[i])
      );
    }
    const o = {
      files: newArr
    };

    console.log(o);
  }

  getBase64(file) {
    return new Promise(function(resolve) {
      var reader = new FileReader();
      reader.onloadend = function() {
        resolve(reader.result)
      }
      reader.readAsDataURL(file);
    })
  }

}

let reader = new ReadFiles();

document.querySelector("input[type=file]")
.onchange = e => reader.addImage.call(reader, e);

<input type="file" multiple>

javascript edu

Javascript Base64 Encoding Function Returns Undefined

Solution 1:

Post a Comment for "Javascript Base64 Encoding Function Returns Undefined"