#61522024年9月18日作者 stpp24 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 任何 可复制演示链接 https://grapesjs.com/demo 描述一下那个虫子 如何复现这个漏洞?添加带有HTML + CSS的自定义代码组件删除自定义代码组件。 预期的行为是什么? 所有代码都应被删除,包括CSS 目前的行为是什么? 自定义CSS不会被移除,但其他部分已经被移除。 [gjs.webm](https://github.com/user-attachments/assets/3fbd9a6d-ad0e-4fc6-add8-7cf31ae9293c) 行为准则 [X] 我同意遵守本项目的行为准则
artf
这与核心无关,应在[插件](https://github.com/GrapesJS/components-custom-code)层面处理。请在那里发布问题,我们会尽力找出合适的方法。
mosh-tudor
@stpp2 这其实不算是个bug;它更像是一种功能。:) 试试用“clearStyles”: https://github.com/GrapesJS/grapesjs/blob/d48e1e34a9fa363dcb83fdcca53a89563db17063/packages/core/src/editor/config/config.ts#L260-L272
stpp2
是的,我这里已经启用了“clearStyles”,但很多情况下效果不好。 无论如何,我预计“自定义代码”组件应该有一定的“容器化”,这样移除后文档里不会留下任何东西。
#61432024年9月10日作者 rhoenerSBS2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v128 可复制演示链接 https://jsfiddle.net/fjyk6n4a/2/ 描述一下那个虫子 你好,@artf, 我目前正在尝试将一个组件包裹在一个截面组件中,如果它还没有被包裹的话。我正在连接 component:mount 事件,并用 section 组件替换新增组件(该组件子节点为新增组件)。 我的代码大致是这样的: “''js editor.on('component:mount', (component) => { if (component.parent().attributes.tagName !== 'b...
jasonvijayy
你好,@artf, [可复制链接](https://codepen.io/Logeshwaran-codepen/pen/raLJpYb) 我用'component.replaceWith()'和UndoManager一起运行时也遇到崩溃。 这只发生在编辑器生命周期事件中触发“replaceWith()” (例如 'change:status', 'component:selected', 'component: deselect') 在撤销时,GrapesJS 尝试恢复旧...
ClaudeCode
谢谢你举报,@rhoenerSBS。 关于BUG/[问题]:如何在添加/挂载时正确包装组件?的好问题。推荐的 Canvas 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('some...
#61422024年9月10日作者 rhoenerSBS2 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v128 可复制演示链接 https://app.grapesjs.com/studio 描述一下那个虫子 添加页面后,通过撤销删除,再用重做重新添加,页面却无法正常工作。图层管理器在选择页面时不会更新。它也没有之前的内容,而且似乎没有正体,因为无法在那个页面添加新组件。我在本地开发中注意到了这种情况,但因为Grapesjs的工作室版本也出现了,我提交了工作室版本的链接以便复制此问题。 如何复现这个漏洞?打开GrapesJs工作室示例添加页面点击撤销 - >页面从列表中移除点击重做 ->页面再次添加点击重做添加的页面查看行为 预期的行为...
ClaudeCode
谢谢你举报,@rhoenerSBS。 关于重做页面功能不正常的好问题。推荐的UndoManager方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something changed'...
#61162024年9月3日作者 SamMousa4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬128 可复制演示链接 https://jsfiddle.net/sammousa/bxgsdc12/11/ 描述一下那个虫子 如何复现这个漏洞?加载一个带有非空 '' 的 HTML 字符串<head>,使用选项 '{asDocument: true}'。通过 'editor.getProjectData()' 导出数据,确认其中包含 '<head>'' 内容通过“editor.loadProjectData()”加载从2导出的数据通过 'editor.getProjectData()' 导出数据,确认它没有 '<head>'' 内容 预期的行为是...
SamMousa
谢谢,但这不是重点。我完全能找到一个变通方法,但这并不能解决这个bug。 bug是通过“getProjectData()”导出,然后通过“loadProjectData()”导入,应该会得到相同的状态。 而且你提议的改版实际上是直接写入画布,这意味着不能保证画布会完全不被动。(例如编辑器中有个“样式”配置,可以将样式注入画布头部)
artf
这个bug是,先通过getProjectData()导出,再通过loadProjectData()导入,应该会得到相同的状态。 是的,绝对不是预期,我们会去了解的。 感谢演示👍中那些易于复现的步骤
artf
谢谢@SamMousa详细的bug报告总是欢迎的。 如果需要指引,我们很乐意为你指引方向 🙇 ♂️
#61022024年8月31日作者 Alababdiy3 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? 铬91V可复制演示链接 https://jsfiddle.net/8tsj5vpb/描述一下那个虫子 我在使用 GrapesJS 时遇到了一个问题,即在重新加载编辑器后,为自定义组件定义的特征没有显示出来。这些特征在组件刚添加时正常工作,但重新加载编辑器(例如刷新页面)后,特征不再出现在特征面板中。 繁殖步骤:使用编辑器定义自定义组件类型。DomComponents.addType,包含默认值部分中的特征。将自定义组件添加到画布中。重新加载编辑器(例如,刷新页面或重新初始化编辑器)。在编辑器中选择自定义组件。 预期行为: 自定义组件定义的特征应在重新加载...
mohamedsalem401
@Alababdiy 我无法通过提供的链接重现问题。 不过,问题似乎在于 GrapesJS 不允许在组件初始化后添加或定义它。
mohamedsalem401
嘿,@Alababdiy, 我没能重现你在JSFiddle中描述的问题。
ClaudeCode
谢谢你举报,@Alababdiy。 自定义组件重新加载编辑器后特征未显示的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根...
#60962024年8月30日作者 kanaihyakumar4 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://jsfiddle.net/kanaihyakumar/oedg76nt/ 描述一下那个虫子 描述 当选择画布上的任何组件时,它会根据设置高亮底部的缩小框。但是,当再次点击同一个组件时,调整大小框就会消失。繁殖步骤使用提供的HTML代码打开GrapesJS。选择画布上的任意组件以查看底部的缩放框。再次点击同一个组件。注意缩小框消失了。预期行为 底部的缩放框即使在重新选择相同组件后仍应保持可见。实际行为 重新选择同一个组件后,底部的缩放框会消失。代码 '''html <!DOCTYPE html> <html lang...
kanaihyakumar
之前,我需要更清楚地说明重现问题的步骤。以下是制作该期的精细步骤。 重现问题的步骤:直接点击该部分。观察显示的可调整大小选项。点击该部分中有列组件的区域(我为视频中所有元素添加了边框以便清晰)。注意,已选中分区组件,但底部可调整大小选项未显示。 [视频链接](https://drive.google.com/file/d/1YUEYZxjpD1Un-xaBRUybuKDZO0_Xffmu/view) 实际行为:直接点击该部分时,底部可调整大小选项如预期显示。然而,当点击有列...
kanaihyakumar
相信我,我很幸运能找到这种点击不同地方的悲惨行为,虽然表现不同,但表现不同。
artf
我觉得如果不是按点击键,它不会消失,但这是预料之中的,因为它准备被拖动
#60922024年8月26日作者 MdShadabAhamad3 个回答
@artf,我有个问题,我们能在Studio里实现自定义JS吗?意思是,有嵌入的 JavaScript 代码功能吗? Originally由@MdShadabAhamad在 https://github.com/GrapesJS/grapesjs/discussions/6080#discussioncomment-10449335发布
artf
@MdShadabAhamad请避免在讨论中开启问题,谢谢
icoco
看起来没有工作室的源代码,你能在哪里找到工作室?
ClaudeCode
谢谢你举报,@MdShadabAhamad。 关于@artf的好问题,我有个问题,我们能在Studio里实现自定义JS吗?意思是有嵌入 JS 代码的功能吗?GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('chang...
#60872024年8月24日作者 leo-budgetsimple3 个回答
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 最新消息 可复制演示链接 https://jsfiddle.net/condsjm1/ 描述一下那个虫子 如何复现这个漏洞?更改组件的内部HTML按CTRL+Z键 预期的行为是什么? 撤销内容 目前的行为是什么? 但内容不会被撤销 描述: 在小提琴上,按下“切换到Hello Planet”的按钮,然后选择编辑器,按CTRL+Z 撤销和重做都不行,但如果你正常改“Hello World”文本,它就能正常工作。 我觉得我改的内容有问题?如果是这样,如何更改组件内容并模拟原生行为的最佳方式?行为准则 [X] 我同意遵守本项目的行为准则
artf
UndoManager跟踪的是组件状态的变化,而不是它的DOM。 这应该适用于你的情况,'element.components('Hello Planet')'
leo-budgetsimple
@artf 谢谢!
ClaudeCode
谢谢你报告,@leo-budgetsimple。 关于在组件内部HTML更改后撤销功能失效的好问题。推荐的UndoManager方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('som...
#60862024年8月23日作者 jdkcoder3 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Edge v128可复现演示链接https://codesandbox.io/p/devbox/github/jdkcoder/cv-builderhttps://stackblitz.com/github/jdkcoder/cv-builder描述一下那个虫子 我在Nuxt.js 3项目中使用GrapesJS,每次在/components/common/LeftSidebar.vue运行clearAll()函数后,都会出现“无法读取未定义属性(读取'lastComponent')”的错误。 “''js const { 实例, reRender, out...
artf
你可以跳过移除组件('instance.value.Components.clear()'),因为你本来就会破坏编辑器 “''js if (确认('你确定要清理画布吗?'){ localStorage.clear() reRender() } ``` 这不应该产生任何错误
WilliamDASILVA
@jdkcoder 通过注释“reRender”功能,这个问题就解决了。 “lastComponent”错误源于编辑器中的“this.get('selected')”在某个节点未定义。通过检查调试器,当调用 reRender 时,确实会变成未定义,因为它重新初始化了葡萄。 关于调整尺寸,我没看到你举的Stackblitz例子有什么问题。我觉得你应该单独开一期,详细说明你的行为和预期。
ClaudeCode
谢谢你举报,@jdkcoder。 无法读取未定义属性(读取“lastComponent”)和可调节大小功能不工作的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeS...
#60812024年8月23日作者 MdShadabAhamad3 个回答
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? 镀铬可复制演示链接 https://stackblitz.com/edit/vitejs-vite-4noagg?file=src%2FApp.tsx描述一下那个虫子 我第一次在 React 应用渲染时无法看到我的自定义组件,当我尝试在块块部分搜索它时,它就出现了,搜索后可以在块块块中看到它。行为准则[X] 我同意遵守本项目的行为准则
artf
当你想在 GrapesJS API 层面扩展某些东西时,可以使用这些插件 “''js <StudioEditor ref={editorRef} 选项={{ 插件:[ editor => addCustomComponent(editor) ], // ... ```
MdShadabAhamad
我还添加了自定义样式设置StyleManager,但显示是空白的,https://stackblitz.com/edit/vitejs-vite-4noagg?file=src%2FApp.tsx
ClaudeCode
谢谢你举报,@MdShadabAhamad。 自定义组件在初次渲染时无法在 grapsJs/studio 中显示的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeS...