React Native 异构节列表

Question

Does anyone have a more elaborate example of heterogeneous rendering in SectionLists?

<SectionList
  sections={[ // heterogeneous rendering between sections
      {data: [...], key: ..., renderItem: ...},
      {data: [...], key: ..., renderItem: ...},
      {data: [...], key: ..., renderItem: ...},
  ]}
/>

Help much appreciated!

Answer 1

Here is an example snippet of how I've been able to implement the heterogeneous rendering for SectionLists

So this is what my sectionsData array looks like

const sectionsData = {
  key: 'On Air',
  data: onAirShows,
  renderItem: ({item}) => <View><Text>{item}</Text></View> //This is what you want this particular section to look like
},
{
  key: 'Off Air',
  data: offAirShows,
  renderItem: this._renderOffAirItems //Same thing for here. You can define it as a helper method and call it here like so
}


<SectionList
 data={sectionsData}
/>

NOTE: The onAirShows and offAirShows is an array