我不完全理解您所说的“覆盖onClick”是什么意思，但是
问题是，尽管我们可以在表达式的右侧分配任何函数处理程序，但左侧必须是静态的。
这是不正确的，左手边可能是动态的，下面是如何：

<button {...({ [eventName]: handler })} />

我想这解决了你的问题。
好吧，上面的语法有点简洁，而且确实令人困惑。这是一个很好的老JSX spread props语法，只是在一个内联对象文字上。
我会给予你另一个等价的形式，希望它应该更具可读性。

const eventName = someCondition ? "onPointerDownCapture" : "onClick"

const props = { 
  [eventName]: handler
}

<button {...props} />

必须使用这些属性名，并且对所有3个属性使用相同的函数名。
这3个属性的作用是注册相关事件。
也许您可以使用useEffect，并有条件地在其中添加一个事件侦听器，而不是建议的React属性。

我认为最好是在注解中使用@vera解决方案。将额外的prop传递给组件（例如isOnClick），并基于此将callback或undefined传递给事件处理程序prop：

function Component(props: { isOnClick: boolean; callback: () => void }) {
  return (
    <div
      onClick={props.isOnClick ? props.callback : undefined}
      onMouseDown={props.isOnClick ? undefined : props.callback}
    />
  );
}

注意，将undefined传递给prop与不设置该prop是一样的。
或者有条件地返回组件：

function Component(props: { isOnClick: boolean; callback: () => void }) {
  if (props.isOnClick) {
    return <div onClick={props.callback}/>
  } else {
    return <div onMouseDown={props.callback}/>
  };
}