Question

我在组件中有以下代码：

  deleteShare: function(e) {
    console.dir(e);
  },

  render: function() {
    createShare = function(share) {
      return (
        <span key={share} className='share'>
          {share}
          <a href="#" onClick={this.deleteShare}>x</a>
        </span>
      )
    }

    return (
      <div>
        <input type='hidden' name='shares' value={this.state.shares.join(',')} />

        <div className='ticket_shares'>
          {this.state.shares.map(createShare)}
          <input type='text' id='new_share' placeholder='Add an email' onKeyDown={this.addShare}/>
        </div>
      </div>
    )
  }

但是，我发现createShare中的onClick on on似乎没有触发，就像它没有绑定一样。控制台中没有任何错误或任何错误。

我认为React正在设置与事件的绑定或某种上下文问题的方式会有一些时髦。我该如何解决这个问题？

Answer 1

在createShare this中将绑定到窗口，因为它在函数内部。

您可以将createShare更改为该组件上的某个方法，React将autobind it to the component更改为Function.prototype.bind，或将其绑定到您对ES6 arrow functions的预期

另一个不错的解决方案是{{3}}，它将this绑定到它们定义的范围，但这需要一些设置

反应缺少一个onClick？

1 个答案: