刚上手 typescript 这个类型我真不知道咋定义了！

[coderabbit]

之前 webpack 配置的 jsx.后面上了 ts，再到后来开启了 eslint. 没有开启 eslint 的时候都能正常不报错。后面开启后我始终不知道这个应该怎么定义了！ 代码：

import * as React from 'react';
import {BaseProps} from '../commonProps';
import {Config, ClassNames, PropTypes} from '../component';

interface IIconProps extends BaseProps {
  name: string,
  color?: string,
  size?: number | string,
  onClick?: (e: React.MouseEvent<HTMLElement>) => void
}

const Icon: React.FC<IIconProps> = (props: IIconProps) => {
  const prefixCls = `${Config.prefix}-icon`;
  const {className, style, name, color, size, onClick} = props;
  const iconStyles = (): object => {
    const sty: React.CSSProperties = {fontSize: null, color: null};
    if (Number.isInteger(size as number)) {
      sty.fontSize = `${size}px`;
    } else {
      sty.fontSize = size;
    }
    if (color) {
      sty.color = color;
    }
    return Object.assign(sty, {...style});
  };
  const cls = ClassNames(
    `${prefixCls}__${name}`,
    className
  );
  const sty = iconStyles();
  const handleClick = (e: React.MouseEvent<HTMLElement>) => {
    if (typeof onClick === 'function') {
      onClick(e);
    }
  };

  return <i className={cls} style={sty} onClick={handleClick}/>;
};

Icon.propTypes = {
  className: PropTypes.string,
  style: PropTypes.objectOf(PropTypes.object),
  name: PropTypes.string,
  color: PropTypes.string,
  size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
  onClick: PropTypes.func
};

export default Icon;

然后 eslint 报

Failed to compile.

[at-loader] ./src/components/icon/Icon.tsx:39:6 
    TS2339: Property 'propTypes' does not exist on type '(props: any) => DetailedReactHTMLElement<{ className: any; style: any; onClick: (e: any) => void; }, HTMLElement>'.

我怎么定义它都是报这个错特来向大家请教，谢谢！

[seki]

从 ../components 里面 import 的 PropTypes 是啥

[yuang]

用了 ts 之后就不需要 PropTypes 了，直接把后面那坨删掉就好

[dremy]

楼主你这么写 FC，性能堪忧啊
举个最简单的例子，onClick 就不用自己再包装一层了吧，真的是负优化…

[coderabbit]

@seki 就是个 interface @yuang 我看别的也定义了 propTypes @dremy 谢谢 之前在额外的 click 里做了事情没有删除完！看来我得去补一波 ts 了

[seki]

PropTypes 不是直接从 prop-types 里面 import 进来就好了吗

[llb123]

用 ts 就是为了不写后面那坨 propTypes 啊。。