React, the map-out element addition event cannot be used

In the use of react, the react map function is often used in the same way as the map in jquery, but if you add it in each map element, you will find that the added event cannot be associated.

For example, we have a lot of comments, I need to add a reply below each comment to the beginning of the input,input is hidden, when I click on the daily comments below the reply, input box display

Here, for example, I have three sets of text in the array, I render them into Li, click each li,alert () out of each Li content, according to the following method, you will find that the error, unable to display

var myTest = React.createclass ({handlechange:function (item) {Console.log (item);},     render:function () {var Showarr y = [' Hello1 ', ' Hello2 ', ' Hello3 ']; Return (<ul>{showarry.map (function (item) {return <li onclick={this.handlechange.bind (this.item)}>{item }</li>;}) } </ul>); }); React.render (<MYTEST/>, document.body);

　　

The right way to do this is not to return at the time of the map. Instead, save the results of the map to a variable, for example, we can save them in an array, and then I return the array. This will achieve our results, the code is as follows:

var myTest = React.createclass ({handlechange:function (item) {Console.log (item);},     render:function () {var Showarr y = [' Hello1 ', ' Hello2 ', ' Hello3 ']; var newarry=[];for (var i=0;i<showarry.length;i++) {var item=showarry[i];return newarry.push (<li onClick={ This.handleChange.bind (This.item)}>{item}</li>)}return (<ul>{newarry} </ul>); }); React.render (<MYTEST/>, document.body);

　　

React, the map-out element addition event cannot be used