Render a nested array of objects in react

Question

I map through multiple objects. [{name:\"y\", country:\"US\", cities:[obj,obj,ob]},{name:\"y\", country:\"US\", cities:[obj,obj,ob]}]

How can I nest

Answer 1

you can make use of nested map to map over the inner child obejcts as well like

     render() {
            const persons = this.state.name.map((item, i) => {
                return (
                   

                      
 {item.name} 
 
                      
 {item.country} 
 
                      
{item.cities.map((city) => {
                             return (
{/* city object details here*/}
)
                       })}
                   
);
            });
            return (
            

                
 
                    All: {persons} 
                
 
            
              );
        }