如何描述链式箭头函数的界面？

Question

如果我想把它描述成独立的函数，这是很简单的例子

interface IProps {
    name: string
}
const renderer = ():React.FC<IProps> => ({name}:IProps) => <div>{name}</div>

我想在一个类中使用这样的函数。

interface zzz {
  renderer: ???
}
class ZZZ {
  renderer = ():React.FC<IProps> => ({name}:IProps) => <div>{name}</div>
}

我不知道如何描述这个界面。

Answer 1

如果问题是关于如何在接口中声明函数，那么你需要这样做。

interface zzz {
   renderer(): React.FC<IProps>
}

此外，如果你想在一个类中使用那个特定的函数并定义它，你需要实现这个接口。

class ZZZ implements zzz {
   rerender(): React.FC<IProps> {
     return (
          ({name: IProps}) => <div>{name}</div>
      );
   }

至于链式箭头函数，只是意味着你要返回另一个函数，所以上述语法对你的用例来说是很成立的。