Reagieren Sie auf die innere JSX-Schleife
P粉966979765
2023-08-23 14:08:12
<p>Ich versuche, in React JSX etwas wie Folgendes zu tun (wobei die ObjectRow eine separate Komponente ist): </p>
<pre class="brush:php;toolbar:false;"><tbody>
for (var i=0; i < numrows; i++) {
<ObjectRow/>
}
</tbody></pre>
<p>Mir ist klar und verstehe, warum dies kein gültiges JSX ist, da JSX Funktionsaufrufen zugeordnet ist. Da ich jedoch aus der Template-Welt komme und neu bei JSX bin, bin ich mir nicht sicher, wie ich das oben genannte Ziel (mehrmaliges Hinzufügen von Komponenten) erreichen kann. </p>
我不确定这是否适合您的情况,但通常地图是一个很好的答案。
如果这是您使用 for 循环的代码:
你可以用 map 这样写一>:
ES6 语法:
将其想象为您只是调用 JavaScript 函数。您不能使用
for
循环来传递函数调用的参数:查看函数
tbody
如何作为参数传递给for
循环 - 导致语法错误。但是您可以创建一个数组,然后将其作为参数传递:
在使用 JSX 时,您基本上可以使用相同的结构:
顺便说一句,我的 JavaScript 示例几乎与 JSX 示例所转换的内容完全相同。尝试使用 Babel REPL 来感受 JSX 的工作原理。