javascript - React Map es6箭头功能不起作用

Question

我有下面的代码，它没有渲染任何内容，我想知道我的错误在哪里，我在控制台中没有看到任何错误。

var App = React.createClass({
   getInitialState(){
   return {
     items:[1,2,3]
   }
   },
   renderItem(){
   this.state.items.map((item,i)=> <li key={i}>{item}</li>)
   },
   render(){
      return(
      <ul>
        {this.renderItem}
      </ul>
      )
   }
})

React.render(<App />, document.getElementById('container'));

http://jsfiddle.net/3Ley7uac/

需要建议。

Answer 1

首先，您需要使用 () 调用您的方法:

  <ul>
    {this.renderItems()}
  </ul>

其次，您需要在方法内部返回:

renderItems(){
    return this.state.items.map((item,i)=> <li key={i}>{item}</li>)
},

这些只是普通的 Javascript 类方法。 React 这里没有做任何特别的事情。您需要像使用任何 Javascript 代码一样调用方法并返回值。