AjjjHsh
AjjjHsh

Reputation: 253

How to iterate nested arrays

I have to iterate nested arrays using react native.

This is the code:

<View>
          {
            courses.map(function(course) {
              return (
                <View>
                  <Text>{course.name}</Text>
                </View>
                {course.lessonPlans.map(function(lesson) {
                    return (
                      <View>
                        <Text>{lesson.name}</Text>
                      </View>
                    )
                  })}
              );
            })
          }
</View>

When I run this code I get unexpected token , How to iterate arrays of arrays using react native ? Thanks.

Upvotes: 0

Views: 44

Answers (1)

Dupocas
Dupocas

Reputation: 21317

You are returning adjacent JSX. Use Fragments:

<View>
    {
        courses.map(function (course) {
            return (
                <>
                    <View>
                        <Text>{course.name}</Text>
                    </View>
                    {course.lessonPlans.map(function (lesson) {
                        return (
                            <View>
                                <Text>{lesson.name}</Text>
                            </View>
                        )
                    })
                    }
                </>
            );
        })
    }
</View>

Upvotes: 1

Related Questions