javascript - 在新行上显示数组中的每个项目

Question

我有一个如下所示的数组:

let array = ["Item 1", "Item 2", "Item 3"]

我需要在新行上显示所有这些项目，因此我使用 join

let joinedArray = array.join("\n")

如果我记录它，它看起来是正确的，但是我需要将它渲染到 DOM，这就是问题所在。如何将这些项目中的每一个以新行分隔到 DOM 中？

return <MyComponent
      { array.length !== 0 &&
        <div>
            {joinedArray}
        </div>
      }
</MyComponent>;

Answer 1

您可以将文本添加到 <p> 中标记为 .map() 渲染所需的 JSX。

使用 <p> 尝试以下操作标签:

return <>
   { array && array.map(e => <p>{e}</p> }
</>

希望这会有所帮助!