主页 / coding / 问题 / 78287293
Accepted
Ooker
Asked: 2024-04-07 17:23:30 +0800 CST

为什么按钮会自动点击 24 次，并且在组件开始渲染时变得无响应？

  • 772

我routes/index.tsx有：

import Main from "../islands/Counter.tsx";

export default function Home() {
  return (<Main />);
}

我islands/Counter.tsx有：

import { useState } from "preact/hooks";

export default function Main() {
  const [count, setCount] = useState<number>(0);
  return (
    <main>
      <button onClick={setCount(count + 1)}>click</button>
      {count}
    </main>
  );
}

第一个渲染显示数字 24，并且 Firefox 表示“此页面正在减慢 Firefox 的速度”。我哪一部分做错了？

reactjs

1 个回答

  1. Best Answer

    您正在调用setCount，而不是将触发它的函数传递给您的onClick处理程序（正如您应该的那样）。

    import { useState } from "preact/hooks";

export default function Main() {
  const [count, setCount] = useState<number>(0);
  return (
    <main>
-      <button onClick={setCount(count + 1)}>click</button>
+      <button onClick={() => setCount(count + 1)}>click</button>
      {count}
    </main>
  );
}
    • 1

相关问题