How do I set the correct 'this' Lexical Scope when using Promises in ES6/React

Question

I'm trying to use the FourSquare API to return location information within my React App. To do this I'm using this useful package: https://www.npmjs.com/package/foursquarevenues

This package uses promises to make the API call. My code calls the package as following. The API call works great and I can log the response - however when I try to set the state it returns this.setState is not a function. I'm very new to ES6 Arrow functions but I tried to rewrite the promise call to use the new syntax - as I thought that using Arrow Functions automatically binds the context of this to the parent scope. However this hasn't solved the problem. What am I doing wrong? Any help appreciated!

foursquare.venues.getVenues(params)
          .then(function(venues) {
            const venueList = venues.response.venues
                console.log(venueList);
            this.setState({
              venues: venueList   // this returns this.setState is not a function
            })
            })
          .catch(err => {
            console.log(err);
          });

Answer 1

(arg1, arg2, arg3) => { this.doSomething(); }

That notation create a function who inherit from the parent this automatically.

The other way is to save this in a constant that will be inherited.

const self = this;
function exemple() {
    self.doSomething();
}