如何循环重复
这是我的代码
这是App.js
import React from 'react';
import './App.css';
import Child from './Child/Child';
function App() {
return (
<div className="container">
<div className='row'>
<Child></Child>
</div>
</div>
);
}
export default App;
这是 Child.js
import React from 'react';
import './Child.css';
function Child() {
return(
<div className='container'>
<div className='row'>
<h1>Mark</h1>
</div>
</div>
)
}
export default Child
如果我的疑问不清楚,请发表评论。
您可以将十个子组件放入一个数组中并渲染它。
const children = []
for(let i = 0; i < 10; i++){
children.push(<Child key={i}/>)
}
return (
<div className="container">
<div className='row'>
{children}
</div>
</div>
);
https://reactjs.org/docs/lists-and-keys.html#rendering-multiple-components https://reactjs.org/docs/lists-and-keys.html#rendering-multiple-components
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)