ReactJS map function cannot find property of undefined

Question

I\'m still learning ReactJS. I\'m challenging myself to write a very basic todo app (as one does) and I\'m having an issue calling an onClick function.

var L         


        

Answer 1

The problem you're running into is that your call to list.map will invoke the passed function with a different this than you have in your render method.

An easy fix is to grab this in the outer scope and stash it in a variable, then use that variable in your inline function.

render: function () {
    var self = this;
 // ^^^^^^^^^^^^^^^^

    var list = this.props.items;
    var items = list.map(function(item){
      return (
        

          
                       // ^^^^
            
            {item}
          
        
      );
    });

    return (
      
{items}
    )
}