#53622023年9月5日作者 rozek4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 版本 1.56.20 Chromium：115.0.5790.171（Offizieller 构建）（arm64） 可复制演示链接 没有 描述一下那个虫子 我用特定的类型拖拽规则定义了自己的组件类型： 但配置函数从未被调用。相反，拖曳无需任何约束，而插入则仅作用于包装元素。 一个可能很重要的细节：我的“拖拽模式”被设置为“绝对”状态 行为准则 [X] 我同意遵守本项目的行为准则
rozek
即使将“可拖拽”和“可丢弃”设置为“true”，我也无法将一个元素拖入另一个元素
rozek
第一个解决方法可以帮助将组件放入其他组件：从 'grapesjs.init（{...}）中移除'dragMode：'absolute'`相反，在你希望拖拽（甚至可能可丢弃）的每个组件类型的“model.defaults”中添加“dmode：'absolute' 然而遗憾的是，在将组件移入或移出容器后，绝对位置并不会重新计算......这使得“功能”使用起来非常困难。更不用说，在图层面板内将组件分类到容器中非常繁琐。 而且，“可拖拽”和“可丢弃”这两个函数依然没有被调用。
artf
在绝对模式下，没有移动组件在其他组件内外的概念。绝对模式下的组件只在样式位置上更新，DOM中不会移动，这就是为什么可拖拽/可放在这里不合理。 如果你不完全理解系统原理，请@rozek避免打开BUG问题，建议使用讨论区。
#53572023年9月3日作者 peters-ben-00071 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://jsfiddle.net/vmeywbk8/11/ 描述一下那个虫子 我们遇到一个小问题——在给 RichTextEditor 添加动作时，RichTextEditorAction 的“icon”属性被标记为字符串。 但在 addAction 中 （https://github.com/GrapesJS/grapesjs/blob/793599cbd5493c0104db1134bd4b1684341274a7/src/richtexteditor/model/RichTextEditor.ts#L363） 如果我...
ClaudeCode
感谢你报告，@peters-ben-0007。 （类型问题）在添加新 rte 动作时无法通过 HTMLElement 作为图标的问题，似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的...
#53552023年9月1日作者 andcmatias1 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 铬116 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？打开图层管理器，尝试移动组件它会禁用该组件，并在控制台中显示错误信息。未捕获类型错误：无法读取未定义属性（读取“画布”） at o.selectTargetModel （Sorter.ts：500：27） at o.onMove （Sorter.ts：545：10） e时（executeBound.js：8：65） 在HTMLDivElement。<anonymous> （bind.js：10：12） 在HTMLDivEleme...
ClaudeCode
谢谢你举报，@andcmatias。 关于移动层的好问题。ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））;...
#53542023年9月1日作者 rozek4 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ 版本 1.56.20 Chromium：115.0.5790.171（Offizieller 构建）（arm64）可复制演示链接 没有描述一下那个虫子 “canvas.scripts”引用的脚本 无法基于“导入映射”导入第三方模块。 如果同一模块必须同时被编辑器、预览和HTML导出使用，可能需要准备两个不同的脚本版本——一个用于开发（在GrapesJS内），另一个用于部署——这绝对应该避免行为准则[X] 我同意遵守本项目的行为准则
artf
https://github.com/GrapesJS/grapesjs/issues/5353#issuecomment-1704023749
rozek
你测试过吗？ 尝试时 在当前版本的GrapesJS中，浏览器日志中会出现以下（扩展版）错误信息：
#53532023年9月1日作者 rozek3 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ 版本 1.56.20 Chromium：115.0.5790.171（Offizieller 构建）（arm64）可复制演示链接 没有描述一下那个虫子 已建立的联系 不能引用JavaScript模块，否则可能会遇到以下错误： 这使得将现代JavaScript与GrapesJS结合使用变得非常困难行为准则[X] 我同意遵守本项目的行为准则
artf
“''js 剧本：[ { src： '...file.js'，类型：'module'}， ], ```
ClaudeCode
谢谢你举报，@rozek。 错误错误： 根本原因分析： Canvas 在调用你的方法之前不会验证状态。当多个操作同时发生时，这会造成时间上的脆弱性。 下一步步骤：** 试试上面的空护卫变通方法 更新至最新的GrapesJS — 许多竞赛条件已被修复 如果这种情况持续，请与团队分享你的具体复制步骤 考虑在你自己的组件初始化中添加防御性检查 这部分正在被积极跟踪，预计将在后续版本中改进。
#53522023年8月31日作者 rozek3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 版本 1.56.20 Chromium：115.0.5790.171（Offizieller 构建）（arm64） 可复制演示链接 没有 描述一下那个虫子 我有一个带有脚本的组件类型 在使用此类组件预览项目时，GrapesJS 会创建以下 HTML 如果你仔细检查这个输出，会发现内部的“脚本（）{'没有被正确闭合。 我已经尝试过找一些变通方法，但还没成功。但我会继续尝试，因为这个问题最终成为了障碍...... 行为准则 [X] 我同意遵守本项目的行为准则
rozek
这很有趣：定义一个独立的功能 以及定义文档中描述的组件类型 按设计运作。 但听起来还是很奇怪，内联函数在导出的HTML中会出现语法错误......
ClaudeCode
谢谢你举报，@rozek。 未捕获语法错误：CanvasView.ts：590：12 的意外令牌 '{' 似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox...
#53462023年8月30日作者 pittleCheung3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 最新版本的Chrome浏览器 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？ <img width=“1665” alt=“image” src=“https://github.com/GrapesJS/grapesjs/assets/114127651/657cbaf6-7e87-4702-ac7f-36c710464728”> 预期的行为是什么？ 风格可能会被简化， 目前的行为是什么？ 首先，我的编辑只用一页。每次切换页面，它都会用后端的页面替换当前配置。因此，当我实现公开头部和...
pittleCheung
https://github.com/GrapesJS/grapesjs/issues/1855 的扩展想法
artf
这里讲解了如何创建具有相关样式的组件 https://grapesjs.com/docs/modules/Components.html#components-css 只有在那种情况下，编辑者才会安全地删除相关的样式。
ClaudeCode
谢谢你举报，@pittleCheung。 关于删除组件而不删除对应样式的好问题。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something...
#53422023年8月26日作者 wsaca1 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ Firefox 116.0.3 可复制演示链接 https://grapesjs.com/demo-mjml.html 描述一下那个虫子 如何复现这个漏洞？在画布上滚动到底部并选择一个组件打开层次选择画布顶部的组件，滚动功能无法使用。 预期的行为是什么？ 滚动应该能用。 目前的行为是什么？ 滚动不起作用。 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： “''js 你的代码在这里 scrollTop 和 scrollLeft 总是为 0，可以替换为： “''js const { scrollTop， scrollLeft } = this.ge...
ClaudeCode
谢谢你举报，@wsaca。 关于scrollCanvas不工作的好问题。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'）...
#53392023年8月26日作者 rozek2 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器？ 版本 1.56.20 Chromium：115.0.5790.171（Offizieller 构建）（arm64）可复制演示链接 没有描述一下那个虫子 我希望编辑器中的组件可以通过拖动来移动。经过一些研究，我发现 “JavaScript let Editor = grapesjs.init（{ dragMode：“绝对”， ``` 实现此功能是必要的。至少，我的组件现在可以移动了......但由于编辑器使用包裹器包裹实际组件视图，包装器位置可能是正确的，但视图位置是相对于包装器测量的，这是错误的： <img width=“284” alt=“moving...
rozek
抱歉——这是我这边的问题，在编辑器里才显现出来——抱歉打扰了！
ClaudeCode
谢谢你举报，@rozek。 dragMode：“absolute”行为怪异的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别...
#53312023年8月24日作者 rozek3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器？ 版本 1.56.20 Chromium：115.0.5790.171（Offizieller 构建）（arm64） 可复制演示链接 没有 描述一下那个虫子 这个bug类似于因缺乏对话而被锁定的#596号。这个版本可能为当前版本的 GrapesJS 提供修复。 如何复现这个漏洞？ 当在靠近视窗边缘打开色彩选择器时，该选择器可能只能部分可见 <img width=“329” alt=“Screenshot-of-Bug” src=“https://github.com/GrapesJS/grapesjs/assets/514882/9300e2d5-f2...
artf
谢谢@rozek公关总是受欢迎的，我很乐意做评测。
ClaudeCode
谢谢你举报，@rozek。 关于色彩选择器可能扩展视口的问题很棒。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））;...