Use 'this' property inside _.map

Question

I'm trying to call a setState function inside of a _.map loop, but the loop lost the property 'this', and I can't use setState on this because this=undefined

  cargaDinamica(){

    _.map(this.state.redis, function(cache){
      obj.url = 'http://localhost:7000/viewlogredis';
      ServiceOS(obj)
      .then(retorno => {
        console.log("aaaa", this);
        view = retorno;
         this.setState({log : view});
      })
      .catch(err => {throw new Error(err)});


    obj = {url : 'http://localhost:7000' + cache.WebService,
            IPRedis: cache.IPDBMaster,
            WebService: cache.WebService,
            log : log};
    console.log("CARGA: ", obj);
     ServiceOS(obj)
       .then(function(carga) {
         console.log('CHEGOU AQUI');
         console.log("OK");
       })
       .catch(err => {throw new Error(err)});


    });

  },

this is my react function /\

pass a function(){}.bind(this) with bounded context – Jonas Wilms Jan 14 '17 at 14:19 — Jonas Wilms, Jan 14 '17 at 14:19

score 0 · Accepted Answer · answered Jan 14 '17 at 14:22

0

You need to change out this part

function(cache)

With

(cache) =>

Function will bind it to its scope, while an arrow function will bind to the this in the context where it was declared.

answered Jan 14 '17 at 14:22

DevNebulae

4,566
3
16
27

2

Note: This is ES6 syntax and might break in old browsers, you can suggest `.bind()` instead. – Mr. Alien Jan 14 '17 at 14:23
1

React gets transpiled down to ES5 if I am not mistaking, so no worries there. – DevNebulae Jan 14 '17 at 14:24
I know, just posting some info here if someone's looking for the similar issue but using only underscorejs without react. – Mr. Alien Jan 14 '17 at 14:37
thanks! it worked 100% – Caíque Carbone Gonçalves Jan 14 '17 at 15:41

score 0 · Answer 2 · answered Jan 14 '17 at 14:25

Assuming this is inside a class extending React.Component, you can bind the lexical this inside the class's constructor:

class YourClass extends React.Component {
  constructor(props) {
    super(props);
    this.cargaDinamica = this.cargaDinamica.bind(this);
  }

  cargaDinamica() {
    your method here
  }

This will ensure that "this" points to the class scope inside your method, as it appears you intend.

Use 'this' property inside _.map

2 Answers2