How do I dynamically create text in React Native using an array as the text source?

Question

I would like to create 8 lines of text based on a pre-made array of text. For example

const someInfo = ["Mobile Phones", "Restaurants", "Tv Channels", "Music", "Health", "Wifi", "Real Estate", "Meetups"];

from there just a simple

export default class User extends Component{
    render(){
        return(
            <View style={styles.mainBoxes}>
                <Text style={styles.mainBoxesText}>{textfromArrayHere}
                </Text>
            </View>

        );
    }
}

how would I go about looping through that array and dynamically insert the text?

Answer 1

consider your array is someInfo, do it the simple way:

<View style={styles.mainBoxes}>
  {someInfo.map(info => <Text>{info}</Text>)}
</View>

Remember: I just give example => You put your own way for styling

Cooler way => using official FlatList with renderItem props also the info => <Text>{info}</Text): https://facebook.github.io/react-native/docs/flatlist.html