Question

我正在学习Flow，因此我正在开发一个带有JavaScript和Flow的小爱好项目。我有一个类Foo和一个不同的类Bar，我想在一个Foo对象数组中作为构造函数中的一个选项。但是，我还希望能够为每个这样的对象发送一些其他数据，所以我想要一个数组，其中每个元素都是一个普通的Foo对象，或者一个Foo对象包含在数组或对象。

但是，当我尝试为此编写代码时，我得到了一些奇怪的错误，我不明白其中的原因。据我所知，它认为存在类型冲突，因为Foo与联合类型的所有不兼容，但据我所知它应该只有至少与其中一个兼容...

以下是重现我得到的确切错误所需的最少代码（link to Try Flow example）：

// @flow

class Foo { }

interface BarOptions {
  foos: ( Foo | [ Foo ] | { foo: Foo } )[];           // line 6
}

class Bar {
  constructor(options?: BarOptions) { }
}

const foo: Foo = new Foo();

const bar = new Bar({
  foos: [ foo ],                                    // line 16
});

我收到以下错误：

Line 6:
  tuple type: This type is incompatible with Foo
  object type: This type is incompatible with Foo
Line 16:
  tuple type: This type is incompatible with Foo
  object type: This type is incompatible with Foo

这些错误是否有直观（或不直观）的原因？

Answer 1

我认为BarOptions实际上应该是类型别名而不是接口。接口declares a type that classes can implement。接口不是数据类型，它们不应包含字段（包含数据）。

如果我们只是将interface BarOptions更改为type BarOptions =，那么一切正常。

或者，您可以将foo更改为getter功能：

interface BarOptions {
  foos(): ( Foo | [ Foo ] | { foo: Foo } )[];
}

Answer 2

你认为它可能与这个开放的Github ticket有关吗？如果我们将interface替换为type，则会验证：

// @flow

class Foo { }

type BarOptions ={
  foos: 
        Class<Foo> |
        Foo |
        Foo[] |
        { foo: Foo } 
}

class Bar {
  constructor(options?: BarOptions) { }
}

const foo: Foo = new Foo();

const bar = new Bar({
  foos: Foo,
//   foos: foo,
//   foos: [foo],
//   foos: { foo: foo },
});

无法将对象数组分配给Flow中的联合类型数组

2 个答案: