Question

TLDR： 无法弄清楚如何解决问题，其中一个最小的例子是reproduced on Try Flow。请帮忙。

更长版本

我在React对象中传递了两个属性。他们的组合使他们分为三种不同的类型：

type BookResource = {|
  objectType: 'book',
  object: Book
|};

type AudiobookResource = {|
  objectType: 'audiobook',
  object: Audiobook
|};

type ComicbookResource = {|
  objectType: 'comicbook',
  object: Comicbook
|};

，其中

type Book = {
  foo: string
}

type Audiobook = {
  bar: string
}

type Comicbook = {
  baz: string
}

所以我将它们组合成一个联合类型，并将结果与组件的其余部分相交：

type Resource = BookResource | AudiobookResource | ComicbookResource;

type Props = {
  text: string,
} & Resource;

然后我希望组件以特定方式运行，具体取决于使用props实际传递的union的成员：

class TestComponent extends Component<Props> {

  render() {
   return null; 
  }

  doMagic() {
    let { objectType, object } = this.props;

    if (objectType === 'book') {
      iWantBook(object)
    }
  }

}

function iWantBook(book: Book) {
 console.log(book.foo) 
}

麻烦的是，Flow没有看到如果objectType道具具有特定类型，则意味着object道具也是特定类型。它试图检查联盟所有成员的属性并给我错误。

我不确定它是否是一个真正的Flow bug，或者是否可以使用类型声明来使Flow区分联盟成员。

Answer 1

尝试this

您需要在此处使用type spread而不是交叉点类型。
您无法使用解构，请参阅issue

Flow并没有从联合中推断出正确的类型

1 个答案: