Quill 如何用 formats 选项限制编辑器只允许指定格式【免费下载链接】quillQuill is a modern WYSIWYG editor built for compatibility and extensibility项目地址: https://gitcode.com/GitHub_Trending/qu/quillQuill 默认允许库中定义的所有格式存在于编辑器内容中。如果你的产品只希望用户看到部分排版能力例如只允许斜体不允许加粗、链接可以在初始化 Quill 时传入formats选项传入一个格式名数组编辑器就只会识别并保留这个列表内的格式。准备工作无论用哪种方式引入 Quill先保证页面里有一个编辑器容器并按主题引入对应样式表link hrefquill.snow.css relstylesheet / div ideditor/div script srcquill.js/scriptCDN 方式下需要包含quill.jsfull build包含核心库、常用主题、格式和模块与所选主题的样式表npm 方式下通过npm install quill安装后在 JS 中import Quill from quill样式表在包的dist目录中例如import quill/dist/quill.core.css。注意主题样式表仍需手动引入Quill 不会替你加载。用 formats 选项限定允许格式formats的默认值是null不传也等效表示允许所有已定义的格式。要缩小范围传一个格式名字符串数组即可const quill new Quill(#editor, { formats: [italic], theme: snow });官方文档给了一个直接可参考的示例文档示例用于演示限制效果把formats设为[italic]后写入一段同时包含斜体和加粗的文本编辑器中只有斜体生效const Delta Quill.import(delta); quill.setContents( new Delta() .insert(Only ) .insert(italic, { italic: true }) .insert( is allowed. ) .insert(Bold, { bold: true }) .insert( is not.) );从哪里选格式名formats数组里填的是格式名不是工具栏按钮。可用名称分三类见 formats 文档类别格式名Inlinebackground、bold、color、font、code、italic、link、size、strike、script、underlineBlockblockquote、header、indent、list、align、direction、code-blockEmbedsformula依赖 KaTeX、image、video例如只保留加粗和有序列表的编辑器可以写成const quill new Quill(#editor, { formats: [bold, list], theme: snow });两个行为细节由 createRegistryWithFormats.ts 和 单元测试 确认核心格式block、break、cursor、inline、scroll、text无论formats怎么写都会被注册不受限制影响需要配套容器的格式会连带注册其容器例如声明list后list-container也会可用数组里写了未注册的名字不会报错中断Quill 会输出Cannot register ... specified in formats config. Are you sure it was registered?的 error 日志并忽略该名称。formats 与工具栏按钮是两回事formats控制的是内容里允许存在哪些格式工具栏配置控制的是页面上显示哪些按钮两者相互独立。文档明确举例你可以让编辑器允许粘贴加粗内容同时工具栏上不显示加粗按钮。反过来也要注意把某个格式从formats中拿掉并不会自动隐藏工具栏上对应的按钮——toolbar 模块不会检测格式是否可用按钮仍会显示。所以实际操作时要两边一起改const quill new Quill(#editor, { formats: [bold, italic], modules: { toolbar: [[bold, italic]] }, theme: snow });工具栏数组只列出你希望保留的控件参考 Toolbar 文档。验证限制是否生效限制生效的直观现象是文档示例中Bold一词不再以加粗呈现。程序上可以用 API 文档 里的getFormat/getContents检查内容中实际携带的格式quill.getFormat(index, length)返回范围内真实存在的格式名和值quill.getContents()返回带格式数据的 Delta。检查时以返回列表中是否还出现未允许的格式名如bold作为判断依据。限制与边界与registry同时使用时formats被忽略。指定registry选项后formats不再生效Quill 会输出Ignoring formats option because registry is specified的警告。需要更精细的自定义、或同一页面多个编辑器各用不同格式集合时走 Registries 文档创建new Parchment.Registry()用registry.register()逐个注册格式需先注册Scroll、Block、Break、Container、Cursor、Inline、Text这些基础格式再把registry传给构造器。格式名必须真实存在。拼错或注册缺失的名字会被静默忽略仅打 error 日志编辑器会按剩下的格式初始化所以发现限制比预期更宽时先检查控制台日志和数组里的拼写。formula需要页面额外引入 KaTeX若不需要公式能力直接不要把它放进formats即可。完成上述配置后粘贴、API 写入和工具栏操作产生的内容都会被收敛到formats允许的范围内的格式集合中。【免费下载链接】quillQuill is a modern WYSIWYG editor built for compatibility and extensibility项目地址: https://gitcode.com/GitHub_Trending/qu/quill创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Quill 如何用 formats 选项限制编辑器只允许指定格式？
Quill 如何用 formats 选项限制编辑器只允许指定格式【免费下载链接】quillQuill is a modern WYSIWYG editor built for compatibility and extensibility项目地址: https://gitcode.com/GitHub_Trending/qu/quillQuill 默认允许库中定义的所有格式存在于编辑器内容中。如果你的产品只希望用户看到部分排版能力例如只允许斜体不允许加粗、链接可以在初始化 Quill 时传入formats选项传入一个格式名数组编辑器就只会识别并保留这个列表内的格式。准备工作无论用哪种方式引入 Quill先保证页面里有一个编辑器容器并按主题引入对应样式表link hrefquill.snow.css relstylesheet / div ideditor/div script srcquill.js/scriptCDN 方式下需要包含quill.jsfull build包含核心库、常用主题、格式和模块与所选主题的样式表npm 方式下通过npm install quill安装后在 JS 中import Quill from quill样式表在包的dist目录中例如import quill/dist/quill.core.css。注意主题样式表仍需手动引入Quill 不会替你加载。用 formats 选项限定允许格式formats的默认值是null不传也等效表示允许所有已定义的格式。要缩小范围传一个格式名字符串数组即可const quill new Quill(#editor, { formats: [italic], theme: snow });官方文档给了一个直接可参考的示例文档示例用于演示限制效果把formats设为[italic]后写入一段同时包含斜体和加粗的文本编辑器中只有斜体生效const Delta Quill.import(delta); quill.setContents( new Delta() .insert(Only ) .insert(italic, { italic: true }) .insert( is allowed. ) .insert(Bold, { bold: true }) .insert( is not.) );从哪里选格式名formats数组里填的是格式名不是工具栏按钮。可用名称分三类见 formats 文档类别格式名Inlinebackground、bold、color、font、code、italic、link、size、strike、script、underlineBlockblockquote、header、indent、list、align、direction、code-blockEmbedsformula依赖 KaTeX、image、video例如只保留加粗和有序列表的编辑器可以写成const quill new Quill(#editor, { formats: [bold, list], theme: snow });两个行为细节由 createRegistryWithFormats.ts 和 单元测试 确认核心格式block、break、cursor、inline、scroll、text无论formats怎么写都会被注册不受限制影响需要配套容器的格式会连带注册其容器例如声明list后list-container也会可用数组里写了未注册的名字不会报错中断Quill 会输出Cannot register ... specified in formats config. Are you sure it was registered?的 error 日志并忽略该名称。formats 与工具栏按钮是两回事formats控制的是内容里允许存在哪些格式工具栏配置控制的是页面上显示哪些按钮两者相互独立。文档明确举例你可以让编辑器允许粘贴加粗内容同时工具栏上不显示加粗按钮。反过来也要注意把某个格式从formats中拿掉并不会自动隐藏工具栏上对应的按钮——toolbar 模块不会检测格式是否可用按钮仍会显示。所以实际操作时要两边一起改const quill new Quill(#editor, { formats: [bold, italic], modules: { toolbar: [[bold, italic]] }, theme: snow });工具栏数组只列出你希望保留的控件参考 Toolbar 文档。验证限制是否生效限制生效的直观现象是文档示例中Bold一词不再以加粗呈现。程序上可以用 API 文档 里的getFormat/getContents检查内容中实际携带的格式quill.getFormat(index, length)返回范围内真实存在的格式名和值quill.getContents()返回带格式数据的 Delta。检查时以返回列表中是否还出现未允许的格式名如bold作为判断依据。限制与边界与registry同时使用时formats被忽略。指定registry选项后formats不再生效Quill 会输出Ignoring formats option because registry is specified的警告。需要更精细的自定义、或同一页面多个编辑器各用不同格式集合时走 Registries 文档创建new Parchment.Registry()用registry.register()逐个注册格式需先注册Scroll、Block、Break、Container、Cursor、Inline、Text这些基础格式再把registry传给构造器。格式名必须真实存在。拼错或注册缺失的名字会被静默忽略仅打 error 日志编辑器会按剩下的格式初始化所以发现限制比预期更宽时先检查控制台日志和数组里的拼写。formula需要页面额外引入 KaTeX若不需要公式能力直接不要把它放进formats即可。完成上述配置后粘贴、API 写入和工具栏操作产生的内容都会被收敛到formats允许的范围内的格式集合中。【免费下载链接】quillQuill is a modern WYSIWYG editor built for compatibility and extensibility项目地址: https://gitcode.com/GitHub_Trending/qu/quill创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考