Typescript将空函数反映为defaultProps

Question

我有一个无状态功能组件,带有一个可选的函数参数作为属性(onClick),我试图将一个空函数定义为默认属性,以便能够在我的组件中安全地执行:

 <span onClick={props.onClick} />

但我有以下错误:"表达预期."

interface IProps {
  size?: sizeType;
  onClick?: (e:any) => void;
}
const Foo: React.SFC = (props: IProps) => {
  // ...
};
const defaultProps: IProps = {
   size: 'default',
   onClick: () => void <-- Expression expected.
};
Foo = defaultProps;

我怎么能这样做？

Answer 1

您不能void在javascript中使用返回值.而不是void,null用作返回值.

onClick: () => null

Answer 2

您可以使用以下内容:

const defaultProps: IProps = {
   size: 'default',
   onClick: () => void(0)
};

Answer 3

我认为使用 lodashes noop 可能是一个不错的选择，因为根据组件在访问 prop 之前重新渲染的次数，它将创建对匿名函数的许多引用，该函数本质上是一个占位符您需要的功能。就像是：

import noop from 'lodash/noop';
MyComponent.defaultProps = {
  myfunc: noop,
};

这是一个小的优化，但也阻止开发人员为每个需要 func 的默认 prop 声明创建匿名函数。