0
182
ViewsHow to use map function and render list in reactjs
I was trying to load this array and render it as a table using map function how can I do it.
The array response is from useState.
I have tried using list indexing and rendering the array as a table but the array changes its number of columns and rows dynamically so indexing does not work as the number of columns and rows keep on changing.
Sample image is shown below:
what I have tried
{arrayData.map(function (item) {
return item;
})}
and got output like
let array = [
[
14.203298568725586,
5.916393756866455,
15.5038480758667,
15.5038480758667,
15.5038480758667
],
[
20.115657806396484,
7.724868297576904,
19.88268280029297,
19.88268280029297,
19.88268280029297
],
[
14.476829528808594,
6.237934112548828,
13.77694320678711,
13.77694320678711,
13.77694320678711
],
[
14.203298568725586,
5.916393756866455,
15.5038480758667,
15.5038480758667,
15.5038480758667
],
[
14.203298568725586,
5.916393756866455,
15.5038480758667,
15.5038480758667,
15.5038480758667
],
]
1 answers
Answer question0
The name of your array and the what you're trying to map do not match.
So
let array
Should be:
const arrayData
For:
{arrayData.map((item) => {
return item;
})}
To work. Also note arrays should be updated with useState so if that's the reason you're using let. You don't mention any further code for the grid you're trying to do. Are you passing this to a component in the map or building everything when looping?
You also have a multidimensional array so I'm unsure what your goal is when you only show one map.