react-native - FlatList header 中有多个元素

Question

有没有什么方法可以将元素数组传递给 FlatList，而无需包装器，以便我以后可以使用 stickyHeaderIndices={[1]}只让第二个元素有粘性？

我的意图是将非粘性标题与粘性工具栏一起使用并将它们传递给组件。

如果我尝试将 renderHeader 作为函数传递给 ListHeaderComponent，例如

  renderHeader = () => {
    const { toolbar, header } = this.props;
    const arr = [header(), toolbar()];
    return arr;
  };

我得到一个

Invariant Violation: Invariant Violation: Invariant Violation: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

Check the render method of `VirtualizedList`.

实现该行为的另一种方法是什么(即)有一个列表，其中只有第二个标题变得粘滞？

我尝试的另一种方法是声明一个带有 3 个 child 的 ScrollView :

The non-sticky header
The toolbar
The flatlist itself

同时设置 stickyHeaderIndices={[1]}在 ScrollView 上。

通过这种方式，我获得了所需的视觉滚动行为(即工具栏变粘了)。但是，通过这种方法，我遇到了外部 ScrollView 和内部平面列表之间发生冲突事件的问题，所以我也不知道这是否是一种有效的方法。

Answer 1

使用带有 1 个 ListHeaderComponent 的节列表和带有粘性标题的 1 个节。我以前成功地做到了这一点。