I have that nested array and can't figure out how to iterate it. Need to get all "ingredients" from each nested array inside the big one. I render 20 recipes, individually need to also render the ingredients for each one respectively. If it is not understandable I will clarify it, or at least try
-
What is the output UI that you want to have? And what have you tried?Ryan Le– Ryan Le2021-08-28 15:14:33 +00:00Commented Aug 28, 2021 at 15:14
-
Does nested array contains different recipes ? Then it depends on the way you want to render these details in your UI. Please explain it further.Kavindu Vindika– Kavindu Vindika2021-08-28 15:24:59 +00:00Commented Aug 28, 2021 at 15:24
-
Don't post images of code, take the time to type out your attempts, your input and expected output.pilchard– pilchard2021-08-28 16:20:58 +00:00Commented Aug 28, 2021 at 16:20
-
see: How to render nested array elements in React?pilchard– pilchard2021-08-28 16:22:45 +00:00Commented Aug 28, 2021 at 16:22
-
Please provide enough code so others can better understand or reproduce the problem.Community– Community Bot2021-08-30 03:33:17 +00:00Commented Aug 30, 2021 at 3:33
Add a comment
|
1 Answer
Since the array is only nested by one degree, a simple call to flat should do the trick:
recipies = [
['ingrediant 1a', 'ingrediant 2a'],
['ingrediant 1b', 'ingrediant 2b']
];
result = recipies.flat();
console.log(result)
2 Comments
Sintaxis Dev
Not precisely, that function's call just mashed all up. I need to get into the first array, and the, for each little array (some of them have 4 ingredients, some 3), need to map it again and return an LI with the value of that ingredient.
Mureinik
@SintaxisDev I'm not sure I understand this statement. Can you please edit your question and share the output you're expecting?
