打字稿：如何抑制“没有重载匹配此调用”？

Question

所以我有一个使用 Native Base 作为 UI 库和 Typescript 的 React Native 应用程序。

现在有一个Accordion - 一旦它展开 - 就会呈现第二个（嵌套的）Accordion。问题是 TypeScript 抱怨：

A VirtualizedList contains a cell which itself contains more than one VirtualizedList of the same orientation as the parent list. You must pass a unique listKey prop to each sibling list.

这很好。但是当我将这个listKey 添加到我的Accordion 时，TypeScript 抱怨No overload matches this call.

如何抑制此警告？因为 Native Base 不提供 listKey 作为他们的 Accordion 的道具。

代码如下：

imports ...

type Props = {};

const Test: React.FC<Props> = ({}) => {

  const renderNestedAccordion = () => {
    return (
      <View>
        <ComponentWithAccordion></ComponentWithAccordion>
      </View>
    );
  };

  const dataArray = [{content: renderNestedAccordion()}];

  return (
    <Accordion
      listKey={'acc'} // error
      dataArray={dataArray}
    />
  );
};

export default Test;

Answer 1

快速修复：

您可以尝试//@ts-ignore，它应该会抑制警告。

For more

不那么有罪的解决方案：

如果您查看 NativeBase type definition 中的 Accordion，您会发现没有 listKey。在底层，NativeBase Accordion 使用 FlatList。我们从 React Native 中知道 type definition 的 FlatList 扩展 VirtualizedListProps<ItemT> 有一个 listKey。

查看Accordion 实现，我们看到FlatList takes all props 来自Accordion，这意味着应该支持所有FlatList 道具。因此Accordion 应该扩展FlatList 道具。您可以将 listKey 添加到 Accordion 类型定义或发送 Github 问题。

免责声明：我从未使用过 Native Base。以上结论是通过查看代码得出的。