How I can show some element inline using method map?

Question

I have such array: let arr = [1,2,3,4,5,6,7,8,9,10]

And I want to display the list of these numbers, so I made like this:

arr.map(el => {
  return (
    <div>{el}</div>
  )
})

So, and it gives me this output:

1
2
3
....

Could I show 3 elements per line?

You could [chunk](https://stackoverflow.com/questions/8495687/split-array-into-chunks) and then map — adiga, Feb 16 '21 at 12:35

score 0 · Accepted Answer · answered Feb 16 '21 at 13:01

let arr = [1,2,3,4,5,6,7,8,9,10];
let i = 0;
let myArray = [];
let resultArray = [];
arr.map(el => {
  myArray.push(el);
  i+=1;
  if(i==3){
  resultArray.push(myArray);
    myArray = [];
    i=0;
  }
})

if(myArray.length>0){
resultArray.push(myArray);
}

let myText="";
for(results in resultArray){
  for(result in resultArray[`${results}`]){
    myText+=resultArray[`${results}`][`${result}`];
  }
  myText+="<br>";
}

document.getElementById("myDiv").innerHTML = myText;

<div id="myDiv"></div>

How I can show some element inline using method map?

1 Answers1