
之前 webpack 配置的 jsx.后面上了 ts,再到后来开启了 eslint. 没有开启 eslint 的时候都能正常不报错。后面开启后我始终不知道这个应该怎么定义了! 代码:
import * as React from 'react'; import {BaeProps} 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>'. 我怎么定义它都是报这个错特来向大家请教,谢谢!
1 seki 2020-03-19 23:06:54 +08:00 从 ../components 里面 import 的 PropTypes 是啥 |
2 yuang 2020-03-19 23:33:09 +08:00 via Android 用了 ts 之后就不需要 PropTypes 了,直接把后面那坨删掉就好 |
3 dremy 2020-03-20 00:32:56 +08:00 via iPhone 楼主你这么写 FC,性能堪忧啊 举个最简单的例子,onClick 就不用自己再包装一层了吧,真的是负优化… |
4 coderabbit OP |
5 seki 2020-03-20 16:59:34 +08:00 PropTypes 不是直接从 prop-types 里面 import 进来就好了吗 |
6 llb123 2020-03-27 16:15:57 +08:00 用 ts 就是为了不写后面那坨 propTypes 啊。。 |