Skip to content

Instantly share code, notes, and snippets.

@syousif94
Created June 23, 2015 05:06
Show Gist options
  • Select an option

  • Save syousif94/559bc7489f714a7accef to your computer and use it in GitHub Desktop.

Select an option

Save syousif94/559bc7489f714a7accef to your computer and use it in GitHub Desktop.
React Native renderSectionHeader example
//First put this in your constructor function:
var getSectionData = (dataBlob, sectionID) => {
return dataBlob[sectionID];
}
var getRowData = (dataBlob, sectionID, rowID) => {
return dataBlob[sectionID + ':' + rowID];
}
this.ds = new ListView.DataSource({
getSectionData: getSectionData,
getRowData: getRowData,
rowHasChanged: (r1, r2) => r1 !== r2,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
})
//Then you have to create a dataBlob object, an array of sectionIDs, and an array of rowID arrays with the following formats:
var dataBlob = {
'sectionID1' : { ...section1 data },
'sectionID1:rowID1' : { ...row1 data },
'sectionID1:rowID2' : { ..row2 data },
'sectionID2' : { ...section2 data },
'sectionID2:rowID1' : { ...row1 data },
'sectionID2:rowID2' : { ..row2 data },
...
}
var sectionIDs = [ 'sectionID1', 'sectionID2', ... ]
var rowIDs = [ [ 'rowID1', 'rowID2' ], [ 'rowID1', 'rowID2' ], ... ]
//Finally, you can create a valid dataSource for your list with:
this.ds.cloneWithRowsAndSections(dataBlob, sectionIDs, rowIDs)
//Hope this helps someone else.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment