如何在Quill

时间:2017-03-24 20:26:19

标签: quill

刚开始使用Quill并发现它非常有用。我的项目需要纯文本编辑。具体来说,我使用quill作为输入YAML代码的表单。短划线" - ",是YAML中的关键项目。问题是Quill自动将该行格式化为子弹。

有没有办法禁用自动项目符号?

凯文

3 个答案:

答案 0 :(得分:5)

如评论中所述,将“格式”选项(而非工具栏区域)中允许的内容列入白名单

var editor = new quill("#someElemId", {
        modules: {
            toolbar: [
                'bold', 
                //{ 'list': 'bullet' }, 
                { 'indent': '-1'}, 
                { 'indent': '+1' }, 
                { 'color': ['black', 'red', 'blue', 'green'] }, 
                'link', 
                'clean'
            ]
        },
        formats : [
            "background",
            "bold", 
            "color", 
            "font", 
            "code", 
            "italic", 
            "link", 
            "size", 
            "strike", 
            "script",
            "underline", 
            "blockquote", 
            // "header",
            "indent", 
            // "list", <-- commented-out to suppress auto bullets
            "align", 
            "direction", 
            "code-block", 
            "formula", 
            "image",
            "video"
        ],
        theme: 'snow', // snow   bubble
    });

答案 1 :(得分:2)

Quill 内置的 Keyboard module 负责自动格式化列表。您可以通过像这样导入和扩展键盘模块来覆盖或禁用此行为。

$("body").click(function(){
        var range = document.createRange();
        var sel = window.getSelection();
        var node = $('div2')[0]; //your node
        range.setStart(node, 0); //your position in node
        range.collapse(true);
        sel.removeAllRanges();
        sel.addRange(range);
    });

如果您仍然列出对其他输入的检测(例如“*”),您可以像这样更改“列表自动填充”绑定匹配的正则表达式

var Keyboard = Quill.import('modules/keyboard');

class CustomKeyboard extends Keyboard {
 static DEFAULTS = {
  ...Keyboard.DEFAULTS,
  bindings: {
   ...Keyboard.DEFAULTS.bindings,
    ['list autofill']: undefined,
  }
 }
}

Quill.register('modules/keyboard', CustomKeyboard);

这是一个工作示例:https://codepen.io/josephdangerstewart/pen/dyNEGoj

有关模块的更多文档可在 Quill 网站上找到:https://quilljs.com/docs/modules/#extending

答案 2 :(得分:0)

查看https://quilljs.com/docs/formats/似乎并不是禁用特定格式的方法,但您可以简单地创建所有格式的列表并删除list格式。