Question

我有以下组件，它应该在p标签中重复hello x time作为重复参数，我有一个问题，在dom中没有渲染，渲染的返回为空。

如何解决？

 const content = 'hello';

 const render= (repeat?: number) => {
   const arr = new Array(repeat || 1)
   return arr.map(n => <p key={n}>{content}</p>)
 }

 export const Print = ({ classes, repeat }: Props) => (
   <div>{render(repeat)}</div>
 )

Answer 1

您应该更新：

const arr = new Array(repeat || 1);

到

const arr = new Array(repeat || 1).fill(null);

否则你最终会得到array of empty slots。它不必是null btw，只要在你map元素之前填充了某些东西。 map不适用于空插槽。

Answer 2

您应该将renderContent更改为render，因为前者未定义。

如何渲染反应组件x次？

2 个答案: