I made a custom component (Item), which should render an image and a text. The component renders the Text, but not the Image component.

Item component:

export default function Item({item}) {
    return (
    <View style={styles.cont}>
        <Image resizeMode="contain" source={require('../assets/products/iphone-1.jpeg')} style={styles.image} />
        <Text>{item.title}</Text>
    </View>)
}

If I try to render this component in a FlatList, then the Image won’t be rendered, only the Text.

export default function HomeScreen() 
    return (
        <View style={styles.container}>
            <Item item={items[0]} />
            <FlatList data={items} renderItem={({item}) => <Item item={item} />}/>
        </View>
    )
}

However, if I put the elements from the Item component directly into FlatList, then it works, like so:

export default function HomeScreen() {
    const [searchText, setSearchText] = useState('')

    return (
        <View style={styles.container}>
            <Item item={items[0]} />
            <FlatList data={items} renderItem={({item}) => (
            <View style={styles.cont}>
                <Image resizeMode="contain" source={require('../assets/products/iphone-1.jpeg')} style={styles.image} />
                <Text>{item.title}</Text>
            </View>
            )}/>
        </View>
    )
}

Where do I have the mistake?