I tried adding 'return' before the JSX, but it stops the iteration. How can I write this correctly?
function App(){
function foo(obj){
for(let key in obj) {
<div>...</div>
}
}
return {
<>
{foo({...})}
</>
}
}
You need to return
the JSX; it can't just be lying around in the function. Something like this should do the trick:
function App(){
function recursion(object){
const ret = [];
for(let key in object){
if(typeof object[key] === 'object'){
ret.push (
<>
<div>{key}</div>
{recursion(object[key])}
</>
);
} else {
ret.push(<div>{key}</div>);
}
}
return ret;
}
return (
<>
{recursion(someObject)}
</>
);
}