numColumns not working in sections list

[vaandhare]

Hi, I am currently working with big list, where my requirement is to show section list with two columns. By using numColumns prop, screen in divided in two halves, where first half of the screen is rendered with items, leaving the second half blank.

Also, the list is initially rendered as blank and becomes visible on re-render.

Versions: "react-native-big-list": "^1.6.1", "react-native": "0.68.0", "react": "18.2.0",

[vaandhare]

const dummyData = [
    [
      // Section 0
      {label: '1', value: 1 /* ... */},
      {label: '2', value: 2 /* ... */},
    ],
    [
      // Section 1
      {label: '3', value: 3 /* ... */},
      {label: '4', value: 4 /* ... */},
    ],
    [
      // Section 2
      {label: '6', value: 6 /* ... */},
      {label: '6', value: 6 /* ... */},
    ],
    /* ... */
  ];

  const headersdummy = ['Header 1', 'Header 2', 'Header 3'];

  const renderDummy = (item: any) => {
    console.log(item);

    return (
      <View
        style={{
          borderWidth: 1,
          borderColor: BLACK,
          marginVertical: 4,
          justifyContent: 'center',
          alignItems: 'center',
        }}>
        <Text style={{fontSize: 15, color: BLACK}}>{item.item.label}</Text>
      </View>
    );
  };

  const renderHeader = (section: any) => {
    return (
      <View>
        <Text>{headersdummy[section]}</Text>
      </View>
    );
  };

  return (
    <BigList
      sections={dummyData}
      numColumns={2}
      renderItem={renderDummy}
      itemHeight={30}
      renderSectionHeader={renderHeader}
      sectionHeaderHeight={25}
    />
  );