I am trying to display a map function, the console.log functions into my map but nothing is displayed on my screen.
There is my map :
const myMap = () => {
followers.map((followers) =>{
console.log(followers.login)
return (
<view>
<h1>
{followers.login}
aaa
{console.log(followers.login)}
{console.log("----------------------")}
</h1>
</view>
);
});
}
the console.log gives the correct answer.
there is my return (look at in the modal):
return (
<View>
<Modal visible={modalOpen} animationType='slide'>
{modalselector == "followers"?
<View>
<MaterialIcons
name='close'
style={styles.modalToggle}
size={24}
onPress={() => setModalOpen(false)}
/>
<Text>
hello
{myMap()}
</Text>
</View>: null }
</Modal>
the hello is displayed, in myMap all the console.logs are working but nothing got displayed.
Thanks for your answers.
Your myMap component is not rendering anything because it is not returning anything, here is a simple code that works. By the way your component should start with an uppercase letter and you cannot use the same variable name 'followers' inside the followers.map
const MyMap = ({ followers }) => {
// Here is the missing return
return (
<>
{followers.map(follower => {
return (
<view>
<h1>{follower}</h1>
</view>
)
})}
</>
)}