CODEWITHSUNDEEP
javascriptreactjsreact-native
William Brochensque junior
William Brochensque junior

Reputation: 2972

React native render list of components

Let's say i have a function who appends to a list some components. The example data is:

var MyComponentList = ['<Text>1</Text>','<Text>2</Text>']

And i just want to render every component of the list in a scrollview. Example:

  render() {
    return (
        <ScrollView>
           {The component goes here}
        </ScrollView>
    )
  }

How can it be made?

Upvotes: 0

Views: 10655

Answers (1)

Vencovsky
Vencovsky

Reputation: 31565

You should use it without ''

const componentList = [<Text>1</Text>, <Text>2</Text>]

And render it like 

render() {
    return (
        <ScrollView>
           {componentList}
        </ScrollView>
    )
}

Another way to do it is have only the data and use .map

render() {
    const data = [1, 2]
    return (
        <ScrollView>
           {data.map(x => <Text>{x}</Text>)}
        </ScrollView>
    )
}

Upvotes: 1

Related Questions