Warning : Failed child context type: Invalid child context 'virtualizedCell.cellKey' of type 'number' supplied to 'CellRenderer', expected 'string'

ios reactjs react-native expo
dhj picture dhj · Mar 30, 2018 · Viewed 21.1k times · Source

I updgraded from react 16.2 -> 16.3-alpha-1 and react-native 0.52->0.54 and I get the warning above in the simulator.

Answer

dhj picture dhj · Mar 30, 2018

To fix the error in any list components where a keyExtractor is in use, update the Component (FlatList etc) to have a string key with .toString(). All keys must now be string values.

Like below;

keyExtractor={item => item.index_id}

to

keyExtractor={item => item.index_id.toString()}

This change is a requirement for all uses of a keyExtractor so that would include React-Native components like; FlatList and ActionSheet.

Related questions

React Native Responsive Font Size

I would like to ask how react native handle or do the responsive font. For example in iphone 4s i Have fontSize: 14, while in iphone 6 I have fontSize: 18.

Read More
Get current scroll position of ScrollView in React Native

Is it possible to get the current scroll position, or the current page of a <ScrollView> component in React Native? So something like: <ScrollView horizontal={true} pagingEnabled={true} onScrollAnimationEnd={() => { // get this scrollview's current page or x/…

Read More
React Native: Getting the position of an element

I am styling an Image component with flexbox to be in the center of the screen which works pretty well. Now I want a second Image component to be displayed directly on the top of the first one. The second …

Read More