页面加载时 Quill 编辑器中的格式化文本

Question

我有一个我认为应该很简单的问题。如何在页面加载时将格式化的多行字符串放入 quill 编辑器？

我想用一个quill编辑器让用户输入json，但是我想在用户第一次访问页面时在quill字段中有一定的json。但是，我似乎无法以任何特定方式格式化 json 。将 json 粘贴到 HTML div 本身显然吃掉了所有白色 space，我在 [=21] 中使用任何一种多行字符串都没有成功=].

这一定是 quill 可以做的事情，因为他们文档中几乎所有的 quill 字段都使用多行格式化字符串。他们是怎么做到的？

P.S。我知道要求用户输入 JSON 听起来很奇怪，相信我，对于这个项目，这是一个要求。这不适用于 public 站点。

Answer 1

您可以尝试将 <pre> 标签内的 json 粘贴到 HTML div 本身：

<div id="editor-container">
  <pre>{
  "firstName": "John",
  "lastName": "Smith",
  "isAlive": true 
  }
  </pre>
</div>

这样可以保留空白。

也就是说，quill 是一个 富文本 编辑器，如果您使用它来输入 json，那么所有这些功能都是多余的。您最好使用像 codemirror 这样的在线代码编辑器让您的用户输入 json。这些在线代码编辑器提供语法高亮功能，使编辑代码（毕竟 json 是代码）变得更加舒适。它将显示一行是否缺少括号、冒号或逗号，这将使您的用户更容易输入 json 结构。

另请查看 YAML，根据我的经验，它比 json 更易于阅读，并且提供相同的功能，并且在大多数计算语言中得到广泛支持。

页面加载时 Quill 编辑器中的格式化文本

Formatted text inside Quill editor on page load

javascript

multiline

heredoc

quill