scrollToLocation和getItemLayout

React Native中的SectionList组件有scrollToLocation方法，可以传递sectionIndex、itemIndex、viewOffset进去，达到滚动到SectionList的某一位置之目的。 例如以下代码可以将SectionList滚动到第三个section的第三个index，并且继续偏移30像素的位置：

this.sectionList.scrollToLocation({
  sectionIndex: 2,
  itemIndex: 2,
viewOffset: 30,
})
....
<SectionList
    ref={
         
  ref => this.sectionList = ref}
/>

但是如果要调用scrollToLocation的时候很可能页面还没渲染好，RN并不知道需要滚动到哪个位置，这个时候需要配合getItemLayout来使用。如果在sectionList中使用了该属性，RN会调用此方法计算列表中各项的显示位置，从而提前得知怎么处理滚动。

<SectionList
...
  getItemLayout={(data, index) => ({
    index,
    offset: OFFSET_FROM_TOP,
    length: ITEM_HEIGHT.
    })
  }
/>

getItemLayout接收两个参数： 第一个参数是所有的渲染数据，即传递给sections属性的数据；第二个参数是渲染元素在所有渲染元素中的位置（数组中的索引）。返回一个对象，该对象包含index: 元素索引位置信息， offset: 该元素距离列表顶部的距离， length: 该元素自身的高度。

怎么理解index？？？？？

1. index是某元素在SectionList所有元素中的索引下标，这里所有元素包括：包括sectionHeader，sectionFooter，item; 意味着如果传递给一个SectionList的数据是这样的：

[{
  title: Section 0,
  data: [item 0-0, item0-1, item0-2],
},
{
  title: Section 1,
  data: [item 1-0, item1-1, item1-2],
}]

那么index为0的时候应该返回第一个section的sectionHeader位置信息!!! index为1的时候，返回第一个section的第一个item的位置信息 index为4的时候，返回第一个Section的sectionFooter位置信息 index为6的时候，才是第二个Section的第一个元素的位置信息 了解了index的含义才能计算好itemLayout。

在sectionList中计算itemlayout是件很艰难的事情，而且局限于知道列表中各种元素的尺寸的情况下才能计算准确。 github中有一个库来帮忙做这件事情：