顺便写一下vue3中quill的使用方法
点击前往quill官网
安装我就不写了 官网里有 npm 一下
注册完就可以组件里使用了
其他属性参考官方文档就可以,我来展示一下options,我是用模块导入的
export default {
debug: "info",
modules: {
toolbar: [
"bold",
"italic",
"underline",
"strike", // toggled buttons
"blockquote",
"image",
// "code-block",
{ header: 1 },
{ header: 2 }, // custom button values
{ 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
],
},
placeholder: "编辑您的内容...",
theme: "snow",
}
效果展示:
界面简洁大方,二次开发很方便,支持作者
下面是使用实例
通过ref
const quillEditor=ref();
quillEditor.value.setText("")//设置文本为空
很清爽,很方便,很棒