将params添加到onKeyPress的功能

时间:2018-04-17 19:14:27

标签: javascript reactjs

我的输入组件有一个onKeyPress监听器。当命中输入键时,onKeyListener会打印一些东西。

这是当前代码

onKeyPress={this.onHitEnter.bind(this)}/>

onHitEnter = (e) => {
        if (e.key === 'Enter') {
          console.log()
    }

现在我想向onHitEnter方法发送一些附加参数。我试图这样做,但它没有工作

这就是我试过的

onKeyPress={this.onHitEnter.bind(this, item, item.id, item.index)}/>

onHitEnter = (e, item, id, index) => {
        if (e.key === 'Enter') {
          console.log("enter")
            console.log(id)
    }

如何将这些附加参数发送到onHitEnter方法?

2 个答案:

答案 0 :(得分:3)

当你使用带有附加参数的bind时,它会先放入其他参数,然后将事件对象放在最后

function foo (a, b, event) {
   console.log(arguments) 
} 


document.querySelector("button").addEventListener("mousedown", foo.bind(this, "a", "b"))
<button>Foo</button>

因此您需要重新排序参数

onHitEnter = (item, id, index, e)

答案 1 :(得分:1)

我建议将你的功能绑定在其他地方。

您可以使用此简写表达式获取所需的数据,因为您使用的是es6:

onKeyPress={e => this.onHitEnter(e, item, item.id, item.index)}/>

表达式定义了您希望在事件期间传递的参数。