Question

我有一个节点的对象，其中有一个我要打印的文本数组。映射功能中带有换行符的文本

   {this.state.nodes.map((node, index) => {

         return(
          <div
                 key={index}
                 className={'node ' + node.className}
                 id={node.id}
                 ref={nodes => this.refs.nodes[index] = nodes}
                 style={node.style}
                 onClick={this.activeElem}

             >

         {node.text}

        })}

它正在打印我尝试过的整个对象\ n和
都无法正常工作，如何使用LineBreak显示它

这是我的Json对象

这是我的json对象的屏幕截图

https://gyazo.com/8da374e8cbdaf85c7516b27c415eab9c

Answer 1

请您尝试一下{node.text}<br/> 或将其插入 div 元素内 <div>{node.text}</div>

如果需要换行数组的内容，可以执行以下操作：

 {node.text.map(item => (
              <div >
                 {item}
              </div>
            ))}

Answer 2

您可以将div包裹在React Fragment中，并在每个div之后放置一个<br>。

Answer 3

在HTML中，您不能通过\ n换行。有多种方法可以使用HTML和CSS进行换行，最简单的方法是<br>标签

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/br

您可以映射到数组并在每次迭代中添加
标签。

对象React.js中的数组中的LineBreak

3 个答案: