React call a function from another function

Question

after setup a simple image upload i've tried to call another function from a function and the logs spits out

Unhandled Rejection (TypeError): self.sendImage is not a function

here is the code

  readFile(files) {
        var self = this;
    if (files && files[0]) {
      let formPayLoad = new FormData();
      formPayLoad.append("attachment_image", files[0]);
      self.sendImage(formPayLoad);
    }

  }

  sendImage(formPayLoad) {
    let auth_token = window.localStorage.getItem("auth_token");
    fetch("/posts", {
      headers: {
        Accept: "application/json",
        Access: auth_token
      },
      method: "POST",
      body: formPayLoad
    })
      .then(response => response.json())

  }

To fix it i've tried to change the variable this to self and still persist the error.

so, please, can someone clarify why this Unhandles Rejecton? is related to class Es6?

@trincot i think yes, and is called from dropzone onDrop={this.readFile} — , Dec 09 '18 at 20:28
The problem is that dropzone will call `readFile` without `this` set to your object. See the duplicate reference to read all about `this`. There are several solutions. One is to do `onDrop={this.readFile.bind(this)}` or `onDrop={() => this.readFile()}` — trincot, Dec 09 '18 at 20:31

score -1 · Accepted Answer · answered Dec 09 '18 at 20:28

-1

You may need to bind the function inside the constructor ex

this.sendImage = this.sendImage.bind(this);

or you can use ES6 and use an arrow function to eliminate the need for an arrow function

sendImage = (formPayLoad) => {
    let auth_token = window.localStorage.getItem("auth_token");
    fetch("/posts", {
      headers: {
        Accept: "application/json",
        Access: auth_token
      },
      method: "POST",
      body: formPayLoad
    })
      .then(response => response.json())

  }

answered Dec 09 '18 at 20:28

Jacob Bralish

261
3
13

thank you i gonna check – Dec 09 '18 at 20:34
Sure thing, let me know if it helps! – Jacob Bralish Dec 09 '18 at 20:38
Jacob Bralish thank you worked! – Dec 09 '18 at 22:49

React call a function from another function

1 Answers1