如何渲染同一组件5次？（克隆组件）

Question

如何将同一组件渲染5次？ （克隆组件） 请告诉我们如何在渲染中渲染同一组件5次。我有5个相同的表格。

Answer 1

您可以使用Array.from创建所需数量的组件副本。

示例

function MyComponent() {
  return <div> MyComponent </div>;
}

function App() {
  return (
    <div>
      {Array.from({ length: 5 }, (_, index) => <MyComponent key={index} />)}
    </div>
  );
}

ReactDOM.render(<App />, document.getElementById("root"));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

<div id="root"></div>