Typescript 数据类型 onClick null 不起作用

我试图学习一些脚本教程，但我想让这个应用程序使用TypeScrip.

import PropTypes from 'prop-types';
import './button.scss'

const Button = (props: any | null | undefined) => {
  return (
    <button
      className={`btn ${props.className}`}
      onClick={props.onClick ? () => props.onClick() : null}
    >
      {props.children}
    </button>
  )
}

export const OutlineButton = (props:any | null | undefined) => {
  return (
    <Button
      className={`btn-outline ${props.className}`}
      onClick={props.onClick ? () => props.onClick() : null}
    >
      {props.children}
    </Button>
  )
}

Button.prototype = {
  onclick: PropTypes.func
}

export default Button

我在这个代码onClick={props.onClick ? () => props.onClick() : null}上有错误

上面写着

Type '(() => any) | null' is not assignable to type 'MouseEventHandler<HTMLButtonElement> | undefined'.
  Type 'null' is not assignable to type 'MouseEventHandler<HTMLButtonElement> | undefined'.ts(2322)
index.d.ts(1489, 9): The expected type comes from property 'onClick' which is declared here on type 'DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>'
(property) React.DOMAttributes<HTMLButtonElement>.onClick?: React.MouseEventHandler<HTMLButtonElement> | undefined

你能帮我解决这个数据类型吗？