当组件未同步时插入文本，文本会从现有模型中被覆盖

Question

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Edge 121.0.2277.83，Firefox 122 可复制演示链接 https://jsfiddle.net/50mga1t7/1/ 描述一下那个虫子 如何复现这个漏洞？创建一个工具栏动作来插入某些文本编辑文本节点并插入部分文本点击工具栏命令插入新的组件/文本textnode 会在编辑前重置为模型详情 预期的行为是什么？ textnode 应该显示当前正在编辑的文本和新插入的文本 目前的行为是什么？ 新文本是使用模型中的文本插入的，而不是当前视图 行为准则 [X] 我同意遵守本项目的行为准则

artf · Accepted Answer

这不是bug，将当前DOM与组件合并需要更多努力。 已经有一个类似的API（https://github.com/GrapesJS/grapesjs/blob/fb5175fd1edd13a2db54d661193fb61a354f8625/src/richtexteditor/model/RichTextEditor.ts#L414），你可以根据自己的需求使用或重新实现（用组件定义代替HTML字符串）。

GJS Helper · Answer

这是GrapesJS用于文本编辑的活动ProseMirror编辑器与组件模型GrapesJS同步的一个已知问题。当你在组件中主动编辑文本时，这些更改会被保存在ProseMirror实例中。如果触发了GrapesJS命令或操作（比如工具栏按钮点击），导致组件被重新渲染或其模型被访问，*在ProseMirror的修改提交回GrapesJS组件模型之前），组件将恢复到最后保存的状态，实际上会丢失未保存的编辑。 根本原因 当文本组件处于编辑模式时，GrapesJS编辑器会为富文本编辑器（ProseMirror）保持独立状态。ProseMirror实例中所做的更改不会立即推送到GrapesJS组件的content属性。只有当文本编辑会话被明确停止时（例如点击组件外、按Escape或程序调用editor.stopCommand('core:component-text-edit')）时，这些更改才会同步。 你的工具栏操作直接修改selected.set('content', selected.get('content') + ' NEW TEXT')，是在ProseMirror更改保存之前，从G...

当组件未同步时插入文本，文本会从现有模型中被覆盖

问题

GrapesJS 版本

你用的是什么浏览器？

可复制演示链接

描述一下那个虫子

行为准则

回答（2）

相关问答

TypeError：e.getRoot 不是函数（样式管理器中的竞态条件）

TypeError：无法读取键盘处理程序中未定义属性（读取“toLowerCase”）

符号样式未同步

可能存在升级路径问题，“textnode”从0.18到>版本被改为“wrapper”。

与此问题匹配的付费插件

相关教程

Introducing Search on GJS.Market

如何在2026年用 GrapesJS 构建AI驱动的页面构建器

2026年构建一个SaaS页面构建器需要多少钱？

浏览插件分类