#49402023年2月21日作者 mani-rai2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Google Chrome 版本 110.0.5481.100（官方版本）（64 位） 可复制演示链接 https://stackblitz.com/edit/js-3urscf?file=index.html,index.js 描述一下那个虫子 如何复现这个漏洞？初始化编辑器销毁编辑器再次初始化编辑器 预期的行为是什么？ 使用的代码只是官方文档中的入门代码。它应该可以毫无问题地重新初始化。 目前的行为是什么？ 控制台上显示多个错误。类型错误：无法读取未定义的属性（读取“get”） at o.runDefault （Editor.ts：874：28）...
artf
是的，由于某些延迟异步函数（例如StorageManager），编辑器实例预计不会立即被销毁，但这可以修复。 目前你可以通过这样做来解决这个问题： “''js setTimeout（（） => { editor.destroy（）; ... ```
ClaudeCode
谢谢你举报，@mani-rai。 关于销毁和重新初始化会产生“无法读取未定义属性（读作'get'）”的好问题。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.l...
#49372023年2月20日作者 besart-k2 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome 版本 110.0.5481.100（官方版本）（arm64）可复制演示链接 没有描述一下那个虫子 我试图在 React 中复制像这个例子 [Vue 块管理器]（https://jsfiddle.net/artur_arseniev/xyofm1qr/）那样自定义块管理器，但“block：custom” 回调没有被调用。 如何复现这个漏洞？ 把它放在初始配置中 'blockManager： { 方块：方块， 自定义：真实 }, 把这个放进 useEffect useEffect（（）=>{ editor.on（'block：custom'，...
artf
@besart-k，你必须提供一个可复现的演示，因为如果它能和当前的Vue演示示例兼容，React中也不应该有不同。也许你用的是旧版的 Grapesjs，或者在 React 应用里做错了什么，所以在这种情况下，可复现的演示是必须的。 我决定关闭这个版本，因为演示本身使用的是最新版本，似乎对自定义方块能正常工作。
ClaudeCode
谢谢你举报，@besart-k。 关于block：custom在React上不工作的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something...
#49292023年2月14日作者 handhikadj4 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome 最新动态可复制演示链接 https://codesandbox.io/s/interesting-bell-xntbtr描述一下那个虫子 如何复现这个漏洞？进入代码沙盒拖放自定义代码块。将此代码放入自定义代码编辑器中，点击保存： '''html <button 类=“btn bg-primary text-white”> <a href=“https://www.example.com/” target=“_blank”>点击我</a> </button> ```点击按钮。点击href链接时按钮应该会打开，但实际上并没有。注意到按钮标签里的...
artf
这是因为[Forms插件]（https://github.com/GrapesJS/components-forms）中的[按钮实现]（https://github.com/GrapesJS/components-forms/blob/6a63e9edb7b085790e90e98acf54accc5f4bd642/src/components.ts#L260），该插件只允许文本节点作为子节点。 如果你移除表单插件，你就能看到“<a>''元素（如果你愿意，也可以用自己的逻辑...
handhikadj
那么按钮的“正常”实现代码是什么？ 顺便问一下，为什么你在Forms插件里让按钮那样表现？
artf
如果我没记错，主要原因是内联文本编辑和按钮元素出现问题，所以这种方法是解决常见问题最简单的方法。 我猜“正常”实现是跳过或覆盖“init”方法，但你应该考虑如何正确处理内联文本编辑。
#49222023年2月11日作者 clonefunnels2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Firefox 可复制演示链接 https://jsfiddle.net/jLgb0mv3/1/ 描述一下那个虫子 如何复现这个漏洞？...把这个代码放进编辑器： editor.on（'styleable：change'， （model， property） => { const value = model.getStyle（）[property]; 如果 （value.indexOf（'！important'） === -1） { model.addStyle（{ [property]： value + ' ！important' }）; } })...
artf
我只看到“复合”/“堆栈”样式管理器属性的问题，因为并非所有样式管理器属性都包含在样式中，所以在你的代码中，你只需要检查样式的值是否真实存在，比如说，'如果 （value && value.indexOf（'！important'） === -1） {...'
ClaudeCode
谢谢你举报，@clonefunnels。 关于使用这里提供的！重要代码会破坏背景图像和渐变，问题非常好。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.lo...
#49212023年2月8日作者 ghost3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome 版本 110.0.5481.78（官方构建）（64 位） 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？安装带有npm或CDN的GrapesJs，并像往常一样初始化到容器，例如带有id #something 的div..在控制台上，检查verbose level是否设置为激活。在所有设置完成后，页面加载完成。刷新页面并留意控制台日志。 预期的行为是什么？ 嗯，冗长的信息应该被修正。 目前的行为是什么？ 目前显示了60多条冗长的信息。 ![截图 2023-02-08 21...
artf
结尾，因为这与核心无关，而是针对[演示页面]（https://github.com/GrapesJS/grapesjs/blob/gh-pages/demo.html），如果你想屏蔽这些警告，请先发布PR
ghost
这和核心版不是演示版页面有关，因为我用演示页做了插画
ClaudeCode
谢谢你举报，@ghost。 关于*的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））; 组件生命周期 edit...
#49202023年2月8日作者 c9a23342 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 与浏览器无关 可复制演示链接 https://codesandbox.io/s/pensive-river-417grm?file=/index.js 描述一下那个虫子 如何复现这个漏洞？import grapesjs/src/i18n/locale/de.js在编辑器配置中将它用作一个位置 预期的行为是什么？ 一切德语 目前的行为是什么？ 除了英语缺少关键字外，还有“background-repeat-sub”、“border-width-sub”、“padding-top-sub”等。因此，即使你用的是德语本地编辑器，编辑器部分是英语的 如果需要...
artf
谢谢@c9a2334你愿意为这个修复贡献一下吗？
ClaudeCode
谢谢你举报，@c9a2334。 关于遗漏de locale的本地化密钥，这是个很好的问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something...
#49192023年2月8日作者 maliuta-oleksandr2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome 109.0.5414.119 可复制演示链接 描述一下那个虫子 如何复现这个漏洞？将事件监听器添加到外部点击调用销毁方法 预期的行为是什么？无错误销毁 目前的行为是什么？ 解析器未定义，但它尝试调用其方法。 未捕获（在promise中）类型错误：无法读取未定义属性（读取“parseHtml”） 呼叫堆栈： 行为准则 [X] 我同意遵守本项目的行为准则
artf
你能提供一个可复现的演示吗？因为我这边无法复现。
ClaudeCode
感谢你举报，@maliuta-oleksandr。 关于调用 destroy 方法会破坏编辑器（React 应用） 的好问题。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（...
#49122023年2月6日作者 lexoyo3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 任何 可复制演示链接 不 描述一下那个虫子 自从从 artf 迁移到 GrapesJS 后，我相信许多链接仍然指向原始仓库 https://github.com/GrapesJS/grapesjs/search?q=artf 我应该尝试替换它，还是我们只能信任GitHub的重定向？ 行为准则 [X] 我同意遵守本项目的行为准则
lexoyo
我做了个人最佳，希望没漏掉什么，几乎每个链接都测试过
artf
我觉得有些内容会重定向，但有些可能坏了，如果有人愿意帮忙🙏，我会很感激
ClaudeCode
谢谢你举报，@lexoyo。 文档中链接损坏的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别根本原因 在报告中包含 Gra...
#49062023年2月6日作者 panditlakshya2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Chrome v108.0.5359.98 可复制演示链接 https://codesandbox.io/s/grapes-js-template-literal-forked-6kgvrb?file=/src/App.js 描述一下那个虫子 我正在尝试创建一个自定义组件，通过脚本注入HTML代码后，能够识别内部HTML组件类型。 如何复现这个漏洞？直接通过脚本注入 HTML 预期的行为是什么？ Canvas 应该能在注入代码后识别文本、图片等组件类型。 目前的行为是什么？ 注入部分被识别为整个文本组件。（注入代码可以包含带有图像或文本的div元素）...
artf
请仔细阅读[本指南]（https://grapesjs.com/docs/modules/Components-js.html），“脚本”中的所有内容都不在编辑器的权限范围内。你可以用 [component.components]（https://grapesjs.com/docs/api/component.html#components） 方法更新组件本身，或者直接在定义中指定 'components： '<div ....'。
ClaudeCode
谢谢你举报，@panditlakshya。 关于Grapesjs在通过脚本设置innerHTML时无法识别组件类型，这个问题非常好。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => co...
#49042023年2月5日作者 handhikadj2 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ Chrome最新可复制演示链接 https://jsfiddle.net/snj87o6f/1/描述一下那个虫子 背景/描述 我觉得这是个bug，因为我需要保存数据，然后用编辑器重新加载。storageManager onStore 上的 Parser.parseHtml。更糟的是，图层管理器的结构在刷新页面时（onLoad运行）会出问题。看起来像编辑器。Parser.parseHtml（） 无法正确解析它 如何复现这个漏洞？拖放倒计时块到画布上查看控制台 预期的行为是什么？ 即使里面有 js，也能生成有效的 html，这样在 storageManage...
artf
输出是正确的（检查真实控制台，而不是 jsfiddle 坏掉的那个），仔细阅读[本节]（https://grapesjs.com/docs/modules/Storage.html#project-data），绝不应该依赖 HTML/CSS 来加载项目。
ClaudeCode
谢谢你举报，@handhikadj。 关于getHtml（）在里面有js时生成无效结构的建议很棒！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“chang...