Reactjs 在渲染函数内部编写内联函数方法和普通方法的区别

我发现很难理解单击按钮调用函数和将参数传递给render中的方法之间的区别。我的问题是为什么我们使用

单击
vs
这个。handleClick（参数）}>单击
在它里面使用箭头意味着什么，我知道它表示一个函数，循环时，我想发送参数，我只能使用
this.handleClick（argument）}>Click
方法发送参数，但我可以使用
Click
方法发送参数，有人能给我解释一下这些区别吗

 handleDel = (id) => {
    this.setState({ todo: this.state.todo.filter((item) => item.id !== id) });
  };

除了绑定之外，我们为什么还要再次使用上面的箭头函数方法，因为我在声明onclick
this.handleClick（argument）}>Click
时已经使用了，我们不能像这样传递参数
this.handleClick（argument）}>Click而不是

 handleDel = (id) => {
   
  };

在React中，我们需要传递一个函数作为事件处理程序，请参阅了解React中处理事件的更多信息。在这两种情况下，我们都在传递一个函数，但有一点不同


当您不想向事件处理程序函数发送任何自定义参数时，我们使用
单击
。默认情况下，这种方式将
event
对象发送到处理程序，该处理程序可根据需要使用


与参数一起，如果我们想要传递事件对象，那么我们可以执行如下操作

const handleClick = (event, data) => { ..... }

//....some code
<button onClick={(e) => this.handleClick(e, argument)}>Click</button>

consthandleclick=（事件、数据）=>{….}
//……一些代码
this.handleClick（e，参数）}>单击
这是否回答了您的问题？该链接清楚地解释了如何传递参数和参数，以及为什么在onClick this.handleClick（argument）}>Click vs Click中使用括号。我想知道这两种函数语法之间的区别。在尝试添加JSX和React API之前，应该先运行一个基本的ES6教程。
const handleClick = (data) => { ..... }

//....some code
<button onClick={() => this.handleClick(argument)}>Click</button>

const handleClick = (event, data) => { ..... }

//....some code
<button onClick={(e) => this.handleClick(e, argument)}>Click</button>