Question

我是React的初学者。在学习React时，有时我看到人们在事件监听器中使用匿名函数，我想知道下面的代码是否相同。我想，要调用函数onDelete，我们只需要使用onClick = {this.onDelete（id）}

    const cartItem=this.props.cart.map((bookCart)=>{
                return (    
    <Button onClick={()=>{this.onDelete(bookCart._id)}}>Delete</Button>
    )
},this;

和

    const cartItem=this.props.cart.map((bookCart)=>{
                return (    
    <Button onClick={this.onDelete(bookCart._id)}>Delete</Button>
    )
},this;

Answer 1

当您需要传递参数时，可以使用箭头功能。

如果在函数中添加括号，则实际执行该函数。

因此，使用此代码：

<Button onClick={ this.onDelete(bookCart._id) }>Delete</Button>

...您要将 onClick 设置为this.onDelete(bookCart._id)的结果

如果你使用这样的箭头功能：

<Button onClick={ () => this.onDelete(bookCart._id) }>Delete</Button>

...然后您将 onClick 设置为一个函数，该函数在执行时将使用参数调用this.onDelete。

我希望这会有所帮助。

什么时候应该在事件监听器中使用匿名函数做出反应？

1 个答案: