Question

我在函数getRowData函数的最后一行之前有一个来自flow的错误：

消息：＆＃39;无法与getRow el.arr绑定data，因为：未知类型[1]的属性arr与数组不兼容输入[2]。或者未知类型[1]的属性arr与...不兼容 string [3]。（参考文献：[1] [2] [3]）＆＃39; at：＆＃39; 60,44＆＃39;来源：＆＃39;流动＆＃39; 代码：＆＃39; undefined＆＃39;

只有当我将Array<string>中的type UserProps更改为Array<mixed>时，此错误才会消失，但我希望保留字符串数组。

我不明白为什么会收到此错误。我明确将data.audio和data.chat设置为Array<string>。任何帮助将非常感谢！

type UserProps = {
  name: string,
  audio: Array<string>,
  chat: Array<string>,
  enableChat: boolean,
  enableAudio: boolean,
  status: string,
};

const getRow = (key, data: string[] | string, style = {}) => {
  const text = Array.isArray(data) ? data.join(", ") : data;
  return (
    <TableRowColumn
      key={`row-${key}`}
      style={{ whiteSpace: "pre-wrap", ...style }}
    >
      {text}
    </TableRowColumn>
  );
};

const getRowData = (data: UserProps) =>
  [
    data.name,
    data.status,
    {
      arr: data.audio,
      style: { color: data.enableAudio ? "green" : "red" }
    },
    { arr: data.chat, style: { color: data.enableChat ? "green" : "red" } }
  ].map(
    (el, i) =>
      el && el.arr && el.style ? getRow(i, el.arr, el.style) : getRow(i, el) // error in el.arr !!!!!
  );

Answer 1

getDataRow没有带注释的返回类型，因此它由返回值隐含，返回值是一个由字符串，字符串，对象，对象组成的数组，然后通过map传递（返回与输入相同的类型）。因此，el回调中的map为string | object。

Flow无法确定arr是否为字符串或对象的属性。它可能是未定义的（我发现了flow对el && el.arr && el.style中复合逻辑测试的解释存在问题。如果你将它们拼写为if语句，它们按预期工作，但是逻辑{{1} }和&&似乎有问题。）

因此，流量认为||与el.arr的第二个参数不兼容，后者需要getRow。

在访问流程属性之前，您需要确定string[] | string的类型。对成员el和arr的存在进行测试并不是这样做的（尽管你可能希望将Disjoint Unions视为一种方式，如果你的类型具有可塑性，但我认为这样做不会'在这种情况下工作是因为你别无选择，只能使用style的股票定义。

作为旁注，尽管速记数组语法（string）可能很方便，但在{type}[]所用的范围较小之前，它可能会与可选或可能的值混淆。因此，我选择使用longhand ?语法。关于这个主题的文档还有更多内容。

Answer 2

错误有点令人困惑，但问题是流无法优化el类型。你可以做些什么稍微改变了改进：

typeof el === 'string' ? getRow(i, el) : getRow(i, el.arr, el.style)

您可以尝试here

无法在flow-js中将类型设置为Array <string>

2 个答案: