输出React组件的n个实例

您可以使用任意数量的JavaScript语言:)

render() {
  const lst = [1, 2, 3, 4];
  return (
    <div>
      {lst.map(itm => <span key={itm}>{itm}</span>)}
    </div>
  );
}

如果您没有 key 就绪,您可以使用映射回调的第二个参数,即数组中的索引。 More info on MDN .

在您的特定情况下,您没有数组,只有一个数字:

render() {
  var times = [];
  for (let i = 0; i < 10; i++) {
    times.push(<MyComponent key={i} i={i} />);
  }
  return <Wrapper>{times}</Wrapper>;
}

this answer 关于如何使用 for 循环。虽然不太好,但也很管用。我相信React团队计划在JSX中更直接地使用阵列。

如果您只有一个数字,并且不想使用for循环,您也可以“伪造”它,例如使用 string.repeat

render() {
  return (
    <div>
      {'a'.repeat(10).split('').map((_, i) => <MyComponent i={i} />}
    </div>
  );
}