javascript - Component not rendering inside map function-React Native - Stack Overflow

admin管理员组

文章数量:1356377

So, I have a dictionary with keys and an array of Objects as values for each key. What I need to do is render a new ponent with props ing from Object for each element of the array. This is how the it looks.

    1:
       [
         Object {
                  "ClassId":232,
                  "Teacher":"TeacherName"
                   ...
                }
        Object {
                  "ClassId":21,
                  "Teacher":"TeacherName"
                   ...
                }
        ...
        ]

This is the code I have right now but somehow the ponent does not render to the screen.

timetable[key]["value"]. The value field is there because the actual value for a key is another dictionary, but I'm only using the value. Printing the elements in the console instead of passing them as props to the CourseCard ponent looks good, the data is there.

       {Object.keys(timetable).map((key, index) => {
                    timetable[key]["value"].map(iter => {
                      return (
                        <CourseCard
                          teacher={iter["Teacher"]}
                          course={iter["ClassName"]}
                          classRoom={iter["ClassRoom"]}
                          time={iter["Time"]}
                          key={iter["Key"]}
                        />
                      );
                    });
                  })}

So, I have a dictionary with keys and an array of Objects as values for each key. What I need to do is render a new ponent with props ing from Object for each element of the array. This is how the it looks.

    1:
       [
         Object {
                  "ClassId":232,
                  "Teacher":"TeacherName"
                   ...
                }
        Object {
                  "ClassId":21,
                  "Teacher":"TeacherName"
                   ...
                }
        ...
        ]

This is the code I have right now but somehow the ponent does not render to the screen.

timetable[key]["value"]. The value field is there because the actual value for a key is another dictionary, but I'm only using the value. Printing the elements in the console instead of passing them as props to the CourseCard ponent looks good, the data is there.

       {Object.keys(timetable).map((key, index) => {
                    timetable[key]["value"].map(iter => {
                      return (
                        <CourseCard
                          teacher={iter["Teacher"]}
                          course={iter["ClassName"]}
                          classRoom={iter["ClassRoom"]}
                          time={iter["Time"]}
                          key={iter["Key"]}
                        />
                      );
                    });
                  })}

• javascript
• reactjs
• react-native

Share Improve this question Follow asked Mar 26, 2018 at 12:00 Radulescu PetruRadulescu Petru 13722 silver badges88 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 10

You need to return the result of inner map function,

   {Object.keys(timetable).map((key, index) => {
                return timetable[key]["value"].map(iter => {
                  return (
                    <CourseCard
                      teacher={iter["Teacher"]}
                      course={iter["ClassName"]}
                      classRoom={iter["ClassRoom"]}
                      time={iter["Time"]}
                      key={iter["Key"]}
                    />
                  );
                });
              })}

本文标签： javascriptComponent not rendering inside map functionReact NativeStack Overflow