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

【问题标题】：Formatted text inside Quill editor on page load页面加载时 Quill 编辑器中的格式化文本
【发布时间】：2018-01-25 08:22:13
【问题描述】：

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

我想用羽毛笔编辑器让用户输入json，但我想在用户第一次访问页面时在羽毛笔字段中有一定的json。但是，我似乎无法以任何特定方式格式化 json。将 json 粘贴到 HTML div 本身显然会吃掉所有的空白，而且我在 javascript 中使用任何类型的多行字符串都没有成功。

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

附：我知道要求用户输入 JSON 听起来很奇怪，相信我，对于这个项目，这是一个要求。这不适用于公共网站。

【问题讨论】：

标签： javascript multiline heredoc quill

【解决方案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 更具可读性，并且提供相同的功能并且在大多数计算语言中得到广泛支持。

【讨论】：

谢谢，太好了。我忘记了pre 标签。但是你关于使用代码编辑器的观点很受欢迎。我可能会切换到那个。