reactjs - 未使用React和Electron调用事件处理程序

Question

我正在尝试Electron，并使用 typescript 设置了一个应用程序并使用react。渲染器中的我的react组件没有按照我通常期望的方式响应事件。
我已经精简了我的React代码以消除多余的位，这是我的App.tsx

import React, { useState } from 'react'

console.log("I'm here I'm ready")

const App: React.FC<{}> = () => {
  const [testValue, setTestValue] = useState(0)

  const handleClick = () => {
    console.log('incrimenting test value')
    setTestValue(s => s++)
  }

  return (
    <div>
      <button onClick={handleClick}>click me</button>
      <p>Test value is: {testValue}</p>
    </div>
  )
}

export default App

这是它运行时的样子

单击该按钮不会执行任何操作。我希望它记录“递增测试值”并更改按钮下显示的值。
有什么想法我做错了吗？
编辑:如果您想 check out 我的webpack配置，package.json等 https://github.com/Si3rr4wow/electron-test-2，这是一个git repo

Answer 1

我通过从17.0.1降级到react@16.13.1和react-dom@16.13.1来解决此问题
编辑:今天找到了一个真正的解决方案。我愚蠢地在我的index.html中添加了bundle.js的脚本标记，这导致了2个虚拟DOM。删除此内容并让webpack附加我的bundle.js后，行为恢复为正常。