如何在反应中在字符串前面添加空格？答案

【问题标题】：How to add space in front of string in react?如何在反应中在字符串前面添加空格？
【发布时间】：2021-03-24 13:45:43
【问题描述】：

我有下面的字符串被渲染，但我希望顶部的字符串向左移动一点，即在它下面的行的顶部居中。如何在消息前添加空格？

我尝试添加一个空间数组，但它不起作用：

     const {totalMinutes} = this.state
     this.setState({
      message: new Array(6).join('  ') + "Your order is in line\n\n" + " Please wait " + totalMinutes + " minutes for more info"
     });

呈现如下：

                <div style={{ display: "flex", justifyContent: "center" }}>
                  
                    <p
                      style={{ alignContent: "center", marginTop: "10px", color:"blue", whiteSpace: "pre-line" }}
                    >
                      {message}
                    </p>
                </div>

【问题讨论】：

在 div 中渲染它，然后使用 flexbox 或 text-align: center 对其
如果总是想要空间，请尝试使用text-indent
你想让 all 的文本居中吗？还是只有“您的订单符合要求”字符串/行？你已经自己尝试过什么？ this.state.message 是如何渲染的？
我已将代码添加到当前的渲染方式中。 @DrewReese 我只希望“您的订单符合要求”位于当前订单的顶部，因为我必须在一个状态消息中完成
然后您需要拆分该文本的呈现，以便您可以将第一行居中对齐并左对齐第二行。文本似乎也不需要存储在状态中，只需渲染它并将totalMinutes状态值渲染到其中。

标签： javascript css reactjs

【解决方案1】：

尝试为<p>标签添加样式属性alignText: center

【讨论】：