【问题标题】:How do I maintain linebreaks and indenting when submitting HTML to a server?将 HTML 提交到服务器时如何维护换行符和缩进?
【发布时间】:2019-11-27 09:44:33
【问题描述】:

我有一个 HTML <textarea> 用于将 HTML 粘贴到其中。 然后将 textarea 的内容提交到 firestore 服务器。

然后我将 HTML 渲染为:
<p white-space: pre-line;>HERE<p>

这种方法将保持换行但不会缩进。

这个:

<div>
  <table>
    <tr>
      <td>Test code</td>
    </tr>
  </table>
</div>

变成这样:

<div>
<table>
<tr>
<td>Test code</td>
</tr>
</table>
</div>

我将如何保持缩进?

【问题讨论】:

    标签: javascript html css reactjs google-cloud-firestore


    【解决方案1】:

    找到了我自己问题的答案。 只需像这样包装从服务器输出的代码。

    <pre>
      <code>OUTPUT</code>
    </pre>
    

    【讨论】:

    • 优秀... :)
    【解决方案2】:

    您可以使用ReactHtmlParser。可以这样称呼ReactHtmlParser(yourHtmlString)

    【讨论】:

    • 你是在&lt;textarea&gt; 还是我要渲染的地方打电话?
    • @Neil 所以你想让textarea 在加载时有缩进吗?还是您在不同于 textarea 的其他地方显示您的 html?
    • 啊,我明白了。这将明显呈现“测试代码”字符串。周围的 HTML 仍然可以运行,但这不是我需要的确切结果。我还想渲染周围的 HTML。 (以便您可以复制和粘贴它)textarea 将 HTML 提交到服务器。然后我在其他地方显示 HTML,但想保持格式并显示 HTML。
    • @Neil 你试过&lt;textare value={ReactHtmlParser(yourHtmlString)}&gt;&lt;/textarea&gt; 吗?这将有助于在您的编辑器中缩进您的 html。
    • 感谢您的帮助。我自己找到了答案,但 ReactHtmlParser 绝对是我以前从未遇到过的有用工具。感谢您指出。
    猜你喜欢
    • 1970-01-01
    • 2020-08-07
    • 2018-12-06
    • 1970-01-01
    • 1970-01-01
    • 2020-12-21
    • 2017-05-23
    • 2022-12-07
    • 2018-10-25
    相关资源
    最近更新 更多