I’m trying to do something like the following in React JSX (where ObjectRow is a separate component):
for (var i=0; i < numrows; i++) {}
I realize and understand why this isn’t valid JSX, since JSX maps to function calls. However, coming from template land and being new to JSX, I am unsure how I would achieve the above (adding a component multiple times).
Think like you\’re calling JavaScript functions. You can\’t loop the arguments to a function call: return tbody( for) i = 0 ; e numrows: il ++ (i++++ ).\n\nSee how the function tbody is passing a for loop as an argument – causing an error in syntax.’ In an array: const rows = [] ; e numrows; ‘i ++++’ : ‘ rows.push(ObjectRow()); ‘ return stubs); .\n\nJSX: const rows = []; for (let i = 0; e numrows); if we add a key prop here, we can uniquely identify each // element in this array: https://reactjs.org/docs/lists-and-keys–t body> and />>.\n\nMy JavaScript example is almost exactly what JSX converts into. Play around with Babel REPL to feel the performance of the jsX?
