如何在Flutter Quill(flutter_quill)中获取带下划线格式的HTML内容?
从Quill获取HTML内容的几种方法
直接跳过Delta转Markdown的步骤,用以下方式可以直接获取准确的HTML内容,完美保留下划线这类格式:
直接从Quill编辑器实例获取
这是最简单的方式,Quill编辑器的内容本身就渲染在DOM节点里,直接取该节点的innerHTML即可:// 假设已初始化Quill实例 const quill = new Quill('#editor', { theme: 'snow' }); // 获取当前编辑器的HTML内容 const htmlContent = quill.root.innerHTML; // 后续将htmlContent上传至服务器即可从已有的Delta对象生成HTML
如果手里只有Delta数据,不想依赖当前编辑器DOM,可以创建一个临时Quill实例来渲染Delta并导出HTML:// 假设你已经有了目标Delta对象 const targetDelta = /* 你的Delta数据 */; // 创建临时Quill实例(无需挂载到页面) const tempEditor = new Quill(document.createElement('div')); tempEditor.setContents(targetDelta); // 导出HTML const htmlContent = tempEditor.root.innerHTML;
之前转Markdown再转HTML的方式会出问题,是因为Markdown里的下划线会被解析为斜体格式,导致原生的下划线样式丢失,而直接从Quill获取HTML能完整保留编辑器里的所有格式。
内容的提问来源于stack exchange,提问作者sahil khatri
相关产品推荐
相关产品推荐

