Event handlers in React - 3

handler-react-3.js

import React, { Component } from 'react'
import { MyInput } from 'myInputs'

class MyComponent extends Component {
  constructor(props) {
    super(props)
    this.handleKeyPress = this.handleKeyPress.bind(this)
  }
  
  handleKeyPress(item) {
    return function(e) {
      e.preventDefault()
      
      if (e.nativeEvent.keyCode === 13) {
        console.log(`This is enter on item, which is called  ${item}!`)
      }
    }
  }
  
  renderItem(item) {
    return (
      <MyInput
        onKeyPress={ this.handleKeyPress(item) }
      />  
    )
  }
  
  render() {
    const items = ['Item1', 'Item2', 'Item3']

    return (
      <div>
        { items.map(this.renderItem) }
      </div>  
    )
  }
}