TrackedSectionList

Wraps SectionList in a ContentContext.

TrackedSectionList<ItemT, SectionT = DefaultSectionT> = (
  props: SectionListProps<ItemT, SectionT> & {
    id: string,
  }
) => SectionList<ItemT, SectionT>

Additional Props​

type
requiredidstring

Automatic Events​

none.

Usage example​

import { TrackedText } from '@objectiv/tracker-react-native';

const Item = ({ title }) => (
  <View>
    <TrackedText>{title}</TrackedText>
  </View>
);
import { TrackedSectionList, TrackedText } from '@objectiv/tracker-react-native';

const DATA = [
  {
    title: "Main dishes",
    data: ["Pizza", "Burger", "Risotto"]
  },
  {
    title: "Sides",
    data: ["French Fries", "Onion Rings", "Fried Shrimps"]
  }
];

<TrackedSectionList
  id="items"
  sections={DATA}
  keyExtractor={(item, index) => item + index}
  renderItem={({ item }) => <Item title={item} />}
  renderSectionHeader={({ section: { title } }) => (
    <TrackedText>{title}</TrackedText>
  )}
/>

Did you know ?

TrackedSectionList internally uses ContentContextWrapper.


See also