Promise.all 错误 - 类型 '(Video | undefined)[]' 不可分配给类型 'Video[]'

时间:2021-02-23 18:35:22

标签: reactjs typescript promise

Promises.all 的类型有问题。它应该返回我的 Video[] 接口,但我收到了类似

的错误 <块引用>

类型 '(Video | undefined)[]' 不能分配给类型 'Video[]'。 输入'视频 | undefined' 不能分配给类型 'Video'。 “未定义”类型不能分配给“视频”类型。

当我将其更改为 (Video | undefined)[] 时,我的整个输入出现错误,它应该再次变为 Video[]

我的代码在这里:

  const getDemo = async () => {
    setError({ show: false, msg: "" });
    try {
      setIsLoading(true);
      const resp: Video[] = await Promise.all(
        ourData.map(async (item) => {
          if (item.type === videoConstants.TYPE_YOUTUBE) {
            return getYouTubeVideo(item.id);
          }
          if (item.type === videoConstants.TYPE_VIMEO) {
            return getVimeoVideo(item.id);
          }
        })
      );
      setData([...data, ...resp]);
    } catch {
      setError({ show: true, msg: "failed to watch demo" });
    }
    setIsLoading(false);
  };

我使用我自己的函数来获取 API 以保持“DRY”规则 - 当我获取单个对象时是可以的,但是当我使用 for Promise.all 从我们的数据库中获取所有集合时,我已经遇到一个我无法处理的错误。

1 个答案:

答案 0 :(得分:2)

代码如下:

if (item.type === videoConstants.TYPE_YOUTUBE) {
  return getYouTubeVideo(item.id);
}
if (item.type === videoConstants.TYPE_VIMEO) {
  return getVimeoVideo(item.id);
}

将返回类型为 Video | undefined,因为没有 else 块。

你可以试试这个(如果 item.type 只能取 videoConstants 中存在的两个值):

if (item.type === videoConstants.TYPE_YOUTUBE) {
  return getYouTubeVideo(item.id);
}
return getVimeoVideo(item.id);

或者也许:

if (item.type === videoConstants.TYPE_YOUTUBE) {
  return getYouTubeVideo(item.id);
}
if (item.type === videoConstants.TYPE_VIMEO) {
  return getVimeoVideo(item.id);
}
return {} as Video // TODO: depends on Video

或者如果你不能做以上任何一项,这可能是你最后的选择 - const resp: (Video|undefined)[] = ...