使用React.PropsWithChildren或者 React.FC给带 children props 的组件 定义类型

App.tsx

// App.tsx 

import { Button } from "./components/Button"

function App() {
  return (
    <div className="App">
      <Button
        onClick={(e) => {
          e.preventDefault()
          console.log(e)
        }}
      >
        Hello World
      </Button>
    </div>
  )
 }
export default App

Button.tsx

// Button.tsx
import React from "react"

type Props = {
  onClick: (e: React.MouseEvent<HTMLButtonElement>) => void
}

export const Button = ({
  onClick,
  children,
}: React.PropsWithChildren<Props>) => {
  return <button onClick={onClick}>{children}</button>
}


// or 
// Use React.FC to type components
// That use children props
export const Button: React.FC<Props> = ({ onClick, children }) => {
  return <button onClick={onClick}>{children}</button>
}