Javascript 如何通过forEach循环将Map（）项呈现到React jsx中？

我有一个Map（）对象处于状态，它存储列表过滤器的一些名称和选项。但我无法通过forEach在JSX中呈现以下映射项：

{
this.state.items.forEach（（值，键）=>(
{value}
))
}

选项1:如果无法使用

映射

，请使用变量

const elems = []
this.state.items.forEach((value, idx) => (
  elems.push(<li key={idx}>{value}</li>)
))

---

这条路对吗？如果我首先将值存储在外部数组中，然后在该数组上执行映射循环，那么在本例中，我添加了一个附加步骤，显然它没有针对大尺寸的MapHuh进行优化？只循环一次，在数组中之前，然后渲染该数组，或者通过

map

操作符内联渲染该数组。这是正确的方法，并且它只循环一次。如果我使用push for elms数组，首先我有一个循环来填充elms，然后第二个循环用于elms.map（）来呈现列表，对吗？或者我搞错了？不，一旦你有了元素数组，你就可以渲染它了。虽然它不是很漂亮，但这在React中是有效的：

{[
val1
，
val2
]}
。我知道了，当我将Array.map（）设置为变量时，它会返回一个数组，但是如果我将该变量设置为Array.forEach（）时，它会返回未定义的、奇怪的JavaScript:-））
<ul>
  {elems}
</ul>

<ul>
  {
    this.state.items.map((value, idx) => <li key={idx}>{value}</li>)
  }
</ul>