Question

我有一个Typescript React类组件，像这样：

import React, { Component } from 'react';

interface Props {
  bar?: boolean;
}

const defaultProps: Partial<Props> = {
  bar: false,
};

class Foo extends Component<Props> {
  render() {
    ...
  }
}

Foo.defaultProps = defaultProps;

export default Foo;

在这里出现以下类型错误：

Property 'defaultProps' does not exist on type 'typeof Foo'.

我看到2种解决方案来解决这个问题。一种是像这样声明类的类型：

class Foo extends Component<Props> {
  static defaultProps: Partial<Props>;

  render() {
    ...
  }
}

另一种方法是完全在类中声明defaultProps，如下所示：

class Foo extends Component<Props> {
  static defaultProps: Partial<Props> = {
    bar: false,
  };

  render() {
    ...
  }
}

我正在使用eslint-config-airbnb 18.0.1和eslint 6.1.0，因此这两个解决方案都抛出此eslint错误：

'defaultProps' should be declared outside the class body (react/static-property-placement)

有没有一种方法可以在类外声明defaultProps而不会引发类型错误？

Answer 1

TS文档说静态defaultProps是the way to go。

似乎很奇怪在TS顶部添加eslint，我相信airbnb配置是针对javascript而非TypeScript的。

类型不存在属性“ defaultProps”

1 个答案: