我一直在尝试几个富文本编辑器,而Quill似乎是在我的项目中实现的最佳工具。我正在使用Node / Express和MongoDB / Mongoose。在“ newPost路线”中,我有一个仅包含标题和主要内容的表格。由于我只是对其进行测试,因此title字段位于Quill编辑器之外。这是我得到的错误:
这是在我点击“提交”之后。控制台不仅显示标题,而且还显示主要内容,该内容具有带有语法突出显示的代码块,这正是我想要的。但是它没有被添加到数据库中。
还有此消息Use of Mutation Events is deprecated. Use MutationObserver instead.
,看来我需要自己更改Quill的源代码以解决此问题。
在控制台上获得帖子的主要内容给我一种感觉,我正在将其付诸实践。
是否有一种不太困难的方法可以使它起作用?谢谢!
var quill;
var metaData = [];
hljs.configure({ // optionally configure hljs
languages: ['javascript', 'ruby', 'python']
});
hljs.initHighlighting();
$(document).ready(function() {
var toolbarOptions = [['blockquote', 'code-block'],
["bold", "italic", "underline", "strike"], // toggled buttons
//['blockquote'],
[{ list: "ordered" }, { list: "bullet" }],
[{ script: "sub" }, { script: "super" }], // superscript/subscript
[{ indent: "-1" }, { indent: "+1" }], // outdent/indent
[{ direction: "rtl" }], // text direction
[{ size: ["small", false, "large", "huge"] }], // custom dropdown
[{ header: [1, 2, 3, 4, 5, 6, false] }],
[{ color: [] }, { background: [] }], // dropdown with defaults from theme
[{ font: [] }],
[{ align: [] }],
["clean"] // remove formatting button
];
quill = new Quill("#snow-container", {
placeholder: "Compose an epic...",
modules: {
syntax: true,
toolbar: toolbarOptions
},
theme: "snow"
});
var oldDelta = {"ops":[{"attributes":{"color":"#000000"},"insert":"This is sample text."}]};
quill.setContents(oldDelta);
});
var form = document.querySelector('form');
form.onsubmit = function() {
// Populate hidden form on submit
var formContent = document.querySelector('input[name=content]');
formContent.value = JSON.stringify(quill.getContents());
console.log("Submitted", $(form).serialize(), $(form).serializeArray());
// No back end to actually submit to!
//alert('Open the console to see the submit data!')
return false;
};