Flatlist can't render items

Question

I wasn't able to understand why it does not render the contents of dummyData when I use it with renderItem arrow function but it works with when I pass {item}) => <Text style={styles.item}>{item.key}</Text> to renderItem props directly

const HomeScreen = ({ navigation }) => {

  const renderItem = ({item}) => {
    <Text style={styles.item}>{item.key}</Text>
  }

  dataUtils.fetchData();
  return(
   <View style={styles.container}>
      <FlatList
        data={dummyData}
        renderItem={renderItem}
        keyExtractor={item => item.id}
      />
    </View>
  );
};

Answer 1

You are missing a return statement. Delete brackets or add a return.

Like this:

const renderItem = ({item}) =>
    <Text style={styles.item}>{item.key}</Text>

Or:

const renderItem = ({item}) => {
    return <Text style={styles.item}>{item.key}</Text>
}