在 React 中，为什么这个 onClick 代码片段可以工作，但我尝试用其他方式编写它却不行？答案

【问题标题】：In React, why does this onClick snippet of code work but not this other way ive tried to write it?在 React 中，为什么这个 onClick 代码片段可以工作，但我尝试用其他方式编写它却不行？
【发布时间】：2021-02-11 20:05:39
【问题描述】：

为什么这对 onClick 有效

const mapDispatchToProps = (dispatch) => ({
  toggleCartHidden: () => dispatch(toggleCartHidden()),
});

<Button
  onClick={() => {
    history.push('/checkout');
    toggleCartHidden();
  }}
>Button text</Button>

但这不起作用（路由不起作用）

<Button
  onClick={
    (() => {
      history.push('/checkout');
    },
    toggleCartHidden)
  }
>Button text</Button>

我有另一个具有类似代码的组件，它使用这种语法与 onClick 一起工作（在 onClick 中没有函数调用）

const mapDispatchToProps = (dispatch) => ({
  toggleCartHidden: () => dispatch(toggleCartHidden()),
});

<div className='cart-icon' onClick={toggleCartHidden}> ICON </div>

【问题讨论】：

标签： javascript reactjs onclick

【解决方案1】：

因为您传递了一个已评估的expression。在expression，您使用, 运算符来评估每个部分，但它只返回最后一个toggleCartHidden。

如果您在控制台上执行(1, 3, 5)，它会返回5。

【讨论】：