Как передать реквизит и прекратить распространение события в React с помощью ES2015?

Question

У меня есть простая компоновка компонентов, и я пытаюсь выяснить, как передать распространение события param и stop в том же обработчике. В связанном примере я хотел бы передать число, связанное с квадратом, вместе с обработчиком кликов, предотвратить поведение по умолчанию по умолчанию и использовать число, чтобы увеличить счетчик. Каждый метод, который я пытаюсь передать по дополнительным параметрам, останавливает e.preventDefault() от предотвращения поведения по умолчанию.

http://codepen.io/anon/pen/JKGKBz?editors=0010

Answer 1

Просто передать значение и событие функции handleClick.

Что-то вроде этого

handleClick(number,e) { 
    e.preventDefault(); 
    this.setState({total: this.state.total + number}) 
    } 

render() { 
    return (
     <div> 
     <h1>{this.state.total}</h1> 
     {[0,1,2,3,4].map((number) => { 
     return (
     <a href="/" onClick={(e) => this.handleClick(number,e)}>{number}</a> 
     ) 
    })} 
     </div> 
    ) 
} 

jsfiddle

или

handleClick(number,e) { 
    e.preventDefault(); 
    this.setState({total: this.state.total + number}) 
} 

render() { 
    return (
     <div> 
     <h1>{this.state.total}</h1> 
     {[0,1,2,3,4].map((number) => { 
     return (
     <a href="/" onClick={this.handleClick.bind(this,number)}>{number}</a> 
     ) 
    })} 
     </div> 
    ) 
} 

jsfiddle