{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/react/issues/16349","repository_url":"https://api.github.com/repos/facebook/react","labels_url":"https://api.github.com/repos/facebook/react/issues/16349/labels{/name}","comments_url":"https://api.github.com/repos/facebook/react/issues/16349/comments","events_url":"https://api.github.com/repos/facebook/react/issues/16349/events","html_url":"https://github.com/facebook/react/issues/16349","id":479274774,"node_id":"MDU6SXNzdWU0NzkyNzQ3NzQ=","number":16349,"title":"How to call function from a function","user":{"login":"gopalkhasria","id":34037169,"node_id":"MDQ6VXNlcjM0MDM3MTY5","avatar_url":"https://avatars2.githubusercontent.com/u/34037169?v=4","gravatar_id":"","url":"https://api.github.com/users/gopalkhasria","html_url":"https://github.com/gopalkhasria","followers_url":"https://api.github.com/users/gopalkhasria/followers","following_url":"https://api.github.com/users/gopalkhasria/following{/other_user}","gists_url":"https://api.github.com/users/gopalkhasria/gists{/gist_id}","starred_url":"https://api.github.com/users/gopalkhasria/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/gopalkhasria/subscriptions","organizations_url":"https://api.github.com/users/gopalkhasria/orgs","repos_url":"https://api.github.com/users/gopalkhasria/repos","events_url":"https://api.github.com/users/gopalkhasria/events{/privacy}","received_events_url":"https://api.github.com/users/gopalkhasria/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2019-08-10T14:52:52Z","updated_at":"2019-08-10T16:17:06Z","closed_at":null,"author_association":"NONE","body":"<!--\r\n  Note: if the issue is about documentation or the website, please file it at:\r\n  https://github.com/reactjs/reactjs.org/issues/new\r\n-->\r\n\r\nI am trying to build an website for upload and download music with firebase. The propblem is i am getting the error Typerror: Cannot read \"uploadMusic\", where upload music is my function that i am calling after image_upload. I also use bind() in cinstructor but still getting sam issue\r\nThis is my code\r\n\r\nclass App extends Component {\r\n  constructor(props) {\r\n    super(props);\r\n    this.state = {\r\n      //.....\r\n    };\r\n    this.upload_image = this.upload_image.bind(this);\r\n    this.uploadMusic = this.uploadMusic.bind(this);\r\n    this.savingAll = this.savingAll.bind(this);\r\n  }\r\n  componentDidMount() {\r\n    var firebaseConfig = {\r\n    };\r\n    if (!firebase.apps.length) {\r\n      firebase.initializeApp(firebaseConfig);\r\n    }\r\n  }\r\n  //code for handle changes\r\n  upload = () => {\r\n    if (\r\n      this.state.music !== \"\" &&\r\n      this.state.singer.length &&\r\n      this.state.album.length &&\r\n      this.state.name.length &&\r\n      this.state.lyrics.length &&\r\n      this.state.category.length\r\n    ) {\r\n      if (this.state.img !== \"\") {\r\n        this.upload_image();\r\n      } else {\r\n        var url = \"somethig\";\r\n        this.uploadMusic(url);\r\n      }\r\n    } else {\r\n      alert(\"fill all the fields\");\r\n    }\r\n  };\r\n  upload_image = () => {\r\n    console.log(\"Uploading image\");\r\n    var img = this.state.img;\r\n    var img_url;\r\n    var ref = firebase\r\n      .storage()\r\n      .ref()\r\n      .child(\"img/\" + this.state.name);\r\n    ref.put(img).then(function(snapshot) {\r\n      ref.getDownloadURL().then(function(url) {\r\n        img_url = url;\r\n        this.uploadMusic(img_url);//cannot start this function\r\n      });\r\n    });\r\n  };\r\n  uploadMusic = img_url => {\r\n    console.log(\"Uploading Music\");\r\n    var music_url;\r\n    var ref = firebase\r\n      .storage()\r\n      .ref()\r\n      .child(\"music/\" + this.state.name);\r\n    ref.put(this.state.music).then(function(snapshot) {\r\n      ref.getDownloadURL().then(function(url) {\r\n        music_url = url;\r\n        this.savingAll(img_url, music_url);\r\n      });\r\n    });\r\n  };\r\n  savingAll = (img_url, music_url) => {\r\n    console.log(\"Saving all\");\r\n    var name = this.state.name;\r\n    var singer = this.state.singer;\r\n    var category = this.state.category;\r\n    var album = this.state.album;\r\n    var lyrics = this.state.lyrics;\r\n    var db = firebase.firestore();\r\n    let data = {\r\n      name,\r\n      singer,\r\n      category,\r\n      album,\r\n      lyrics,\r\n      icon: img_url,\r\n      music_url: music_url\r\n    };\r\n    db.collection(\"tracks\")\r\n      .doc(name)\r\n      .set(data);\r\n    if (this.state.new_singer) {\r\n      console.log(\"Adding singer\");\r\n      db.collection(\"singers\")\r\n        .doc(\"singer\")\r\n        .set({ name: singer });\r\n    }\r\n    console.log(\"All finish\");\r\n  };\r\n\r\nWhat can i do i have the same issue when i try to read state sometimes"},"comment":{"url":"https://api.github.com/repos/facebook/react/issues/comments/520161308","html_url":"https://github.com/facebook/react/issues/16349#issuecomment-520161308","issue_url":"https://api.github.com/repos/facebook/react/issues/16349","id":520161308,"node_id":"MDEyOklzc3VlQ29tbWVudDUyMDE2MTMwOA==","user":{"login":"MarkMurphy","id":873474,"node_id":"MDQ6VXNlcjg3MzQ3NA==","avatar_url":"https://avatars2.githubusercontent.com/u/873474?v=4","gravatar_id":"","url":"https://api.github.com/users/MarkMurphy","html_url":"https://github.com/MarkMurphy","followers_url":"https://api.github.com/users/MarkMurphy/followers","following_url":"https://api.github.com/users/MarkMurphy/following{/other_user}","gists_url":"https://api.github.com/users/MarkMurphy/gists{/gist_id}","starred_url":"https://api.github.com/users/MarkMurphy/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/MarkMurphy/subscriptions","organizations_url":"https://api.github.com/users/MarkMurphy/orgs","repos_url":"https://api.github.com/users/MarkMurphy/repos","events_url":"https://api.github.com/users/MarkMurphy/events{/privacy}","received_events_url":"https://api.github.com/users/MarkMurphy/received_events","type":"User","site_admin":false},"created_at":"2019-08-10T16:17:06Z","updated_at":"2019-08-10T16:17:06Z","author_association":"CONTRIBUTOR","body":"Hi @gopalkhasria,\r\n\r\nThis is the sort of question that's more appropriate for something like StackOverflow because it's just a generic question regarding javascript. \r\n\r\nThe problem is with the function you passed to `then`:\r\n\r\n```js\r\nref.getDownloadURL().then(function(url) {\r\n  img_url = url;\r\n  this.uploadMusic(img_url);\r\n});\r\n``` \r\n\r\nIt's not an arrow function or bound to the current scope using bind so it's changing the value of `this`.\r\n\r\nYou should read this: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this \r\n\r\nBecause you're using arrow functions already for your class methods, you don't need to bind them in the constructor, you can remove those lines.\r\n\r\nSo one option is to do this:\r\n\r\n```js\r\nref.getDownloadURL().then((url) => {\r\n  img_url = url;\r\n  this.uploadMusic(img_url);\r\n});\r\n``` \r\n\r\nI'm not sure you're actually doing anything with `img_url` after assigning it there so you could potentially simplify it even further:\r\n\r\n```js\r\nref.getDownloadURL().then(this.uploadMusic);\r\n``` \r\n\r\nor if you use async/await:\r\n\r\n```js\r\nconst downloadUrl = await ref.getDownloadURL()\r\nthis.uploadMusic(downloadUrl);\r\n``` \r\n"}}
{"actor":{"display_login":"MarkMurphy"}}