Javascript onClick不是一致性

我对React中的事件有意见。链接到 这是我的index.js文件

import*as React from“React”；
从“react dom”导入react dom；
函数App（）{
const[x，setX]=React.useState（true）；
React.useffect（（）=>{
setTimeout（（）=>setX（false），1000）；
}, []);
返回(
{
控制台日志（“单击”）；
}
：未定义
}
>
你好，世界
);
}
render（，document.getElementById（“容器”）；

运行useffect后，onClick设置为

undefined

期望值： 没有单击事件附加到div

实际值： 有一个从React DOM生成的noop函数连接到div。

链接到

import*as React from“React”；
从“react dom”导入react dom；
函数App（）{
const[x，setX]=React.useState（true）；
常量切换=（）=>{
setX（！x）；
日志（x？“单击）：“未定义”）；
};
返回(
你好，世界
{x？“Im关闭”：“Im打开”}
);
}
render（，document.getElementById（“容器”）；

React事件不会像

onclick

那样放在html事件属性上，即它看起来不像

IIRC React通过

addEventListener

在窗口/文档集上使用全局委托事件处理程序集，因此，至少我可以看到我的console.log语句在哪里？您可以在代码中看到console.log。为什么你需要在inspector中看到它？我需要做一些关于可访问性的事情。如果我删除

在三元运算符中，单击事件成为React DOM的noop函数。它必须是未定义的，不是吗？它还是一样的。我需要设置onClick是未定义的，而不是noop函数或任何满足特定条件的东西。我知道它是一样的。。你能试试看吗？我检查并更新了帖子。你有这种行为吗？给予消极的回答能解决你的问题吗？好啊我不明白你想用useEffect做什么？我知道您想切换您的状态，但再次说明，对于单击的或未定义的，您试图在控制台日志中执行什么操作。我已经编辑了我的答案。让我知道它是否解决了您的问题，或者您在使用它时是否面临任何问题。我尝试删除useEffect，发现问题属于React。当我们用某个函数声明onClick时，然后将其设置为undefined。然后，它不是完全未定义的，只需将其设置为伪函数，如（）=>{}。我想要的是，这个元素根本没有附加任何事件。

import * as React from "react";
import ReactDOM from "react-dom";

function App() {
  const [x, setX] = React.useState(true);
  
  const toggle = () => { 
    setX (!x);
    console.log(x ? "clicked": "undefined");
  };

  return (
    <div>
      <div onClick={toggle}>Hello World</div>
      <div>{x ? "Im closed" : "Im open"}</div>
    </div>
         );
     }

ReactDOM.render(<App />, document.getElementById("container"));