Question

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

现在有一个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

无罪解决方案：

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

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

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

打字稿：如何取消“此调用无重载”？

1 个答案: