Need explanation on how to get the values in example

[resting]

1. Can you please explain why is getItemHeight: (rowData, sectionIndex, rowIndex) => sectionIndex === 0 ? 100 : 50,

Do you only set for sectionIndex 0?

2. Is listHeaderHeight not necessary if we're using SectionList instead of FlatList? Ie, if there's a getSectionHeaderHeight set, then listHeaderHeight is not necessary?

Reason for asking is because scrollToLocation is not accurate when I implemented this.

Quoting the example:

this.getItemLayout = sectionListGetItemLayout({
      // The height of the row with rowData at the given sectionIndex and rowIndex
      getItemHeight: (rowData, sectionIndex, rowIndex) => sectionIndex === 0 ? 100 : 50,

      // These four properties are optional
      getSeparatorHeight: () => 1 / PixelRatio.get(), // The height of your separators
      getSectionHeaderHeight: () => 20, // The height of your section headers
      getSectionFooterHeight: () => 10, // The height of your section footers
      listHeaderHeight: 40, // The height of your list header
    })

[smitthakkar1]

I read the Medium post but things are still not clear. getItemLayout comes with 2 arguments data and index which is not mentioned in the medium post.

Also please answer these questions as well.

1. Why this.getItemLayout is defined in the constructor?
2. How do I pass rawData and rowIndex ?

[jsoendermann]

@resting No particular reason, I just copied this code from an app I was working on. It means the first item has height 100, all others 50. This library isn't necessary if all you're using is a FlatList. It won't work with that. scrollToLocation has all kinds of bugs, lots of people seem to have trouble with it.

@smitthakkar1 sectionListGetItemLayout is a higher order function that takes some arguments and returns the getItemLayout function you pass as a prop to SectionList. No particular reason it's called in the constructor, you could also call it outside of your component.