Javascript For循环可能不会渲染组件

我面临的问题是，我希望一个组件的渲染量与我为循环指定的渲染量相同， 在本例中为5次

for (var k = 0; k <= 5; k++) {
      return(
           <div>Hi</div>
      )
}

---

但是它只渲染一次，有什么想法吗？

你不能使用for循环来渲染jsx，你必须使用这样的贴图：

{Array(5).fill(0).map((_, i) => <div key={i}>Hi</div>)}

{
    Array(5).fill('Hi').map((item, i) => <div key={i}>{item}</div>
}

---

循环一遇到return语句就退出。您需要返回要渲染的所有值以使其工作。当map返回一个新数组时，这里的map工作得更好，而不是for循环

你可以这样做：

{Array(5).fill(0).map((_, i) => <div key={i}>Hi</div>)}

{
    Array(5).fill('Hi').map((item, i) => <div key={i}>{item}</div>
}

首先，我将使用Array5创建一个包含5项的数组。然后用Hi填充所有值。然后使用数组上的映射迭代并为数组中的每个条目返回一个div

---

在react中，创建元素列表时需要添加键。键是需要为重复元素包含的特殊字符串属性。您可以在此处了解更多信息：

您可以使用react中的list和key。请像这样试一下

const list = Array(5).fill("Hi")
const elems = list.map((item ,i) => {
    return <div key={i}>{item}</div>
})

display elems in your template like this

{elems}

---

您的返回退出循环。您需要收集所有数据并在循环结束后返回它们，我如何才能做到这一点？这取决于您想做什么，您是否正在尝试将div添加到DOM中？