GrapesJS 问题

已收录 3,464 个 GitHub 问题 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。

找到 743 个问题

🔍 bug
#62502024年10月23日作者 maxming23332 个回答
0 个反应

克隆页面提示“将循环结构转换为 JSON”

葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome 129.0.6668.101可复制演示链接 https://grapesjs.com/demo描述一下那个虫子 如何复现这个漏洞? 开放 https://grapesjs.com/demo 在 DevTools 中运行这个脚本: “''js const page = 编辑。Pages.getSelected(); const component = page?.getMainComponent()?clone(); 编辑。Pages.add({ 名称:“11111”, 组成部分, }, { 选择:真, }); TypeError:将循环结构...

maxming2333

除了上述方法,还有其他复制页面的方法吗?

ClaudeCode

谢谢你举报,@maxming2333。 关于Clone页面提示“将循环结构转换为JSON”,这个问题非常好。推荐的组件方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('somethin...

#62492024年10月23日作者 yashvi20263 个回答
0 个反应

最初的定制色彩选择器

葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? 铬可复制演示链接 ---描述一下那个虫子 editor.getModel().initBaseColorPicker(DomElement, { / spectrum options / }); 在内化之后,当 palete 打开时,我想给它设置一个颜色?@artf行为准则[X] 我同意遵守本项目的行为准则

NeonLexie

这看起来很有趣。我倒是愿意试试看。

yashvi2026

ClaudeCode

谢谢你举报,@yashvi2026。 初始化自定义色彩选择器的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因 在报...

#62482024年10月22日作者 Frubl2 个回答
1 个反应

当iframe身体有缩放时,showOffsets bug出现

葡萄JS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://jsfiddle.net/a2hbxg0y/1/ 描述一下那个虫子 如何复现这个漏洞?打开开发工具,编写 iframe 正体元素样式 - 缩放:n; 目前的行为是什么? 当鼠标悬停在元素上时,蓝色边框会正常工作,而偏移量则不然。它们的大小与变焦时相同:1; 附言:我无法分享完整复制演示的链接,因为CSS的更改需要在Canvas内完成。 附言: 可能已经有合适的缩减内容的方法,但我只找到了整个画布的缩放。我想让其中一种设备的缩放更小 行为准则 [X] 我同意遵守本项目的行为准则

artf

你不应该编辑iframe的缩放,应该用[原生API](https://grapesjs.com/docs/api/canvas.html#setzoom)

ClaudeCode

谢谢你举报,@Frubl。 关于 iframe 身体缩放时出现的 showOffsets bug,这个问题非常好。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => conso...

#62112024年10月11日作者 jlafosse4 个回答
0 个反应

递归过多

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Firefox 131.0.2 可复制演示链接 https://grapesjs.com/demo-newsletter-editor.html 描述一下那个虫子 如何复现这个漏洞?进入 grapesjs 演示,然后导入以下 html: '''html <div class=“foobar”> <img data-gjs-locked=“true” width=“500” src=“https://cdn.pixabay.com/photo/2021/12/16/15/26/forest-68747171280.jpg”> </div> 我怀疑问题来...

artf

嘿,@jlafosse谢谢你的报告。 我不认为最新版本会有这个问题: <img width=“123” alt=“截图 2024-10-21 19 00 04” src=“https://github.com/user-attachments/assets/ff074a31-cd19-4547-bb27-596c92e16d64”> 你能再试着再检查一次吗?

jlafosse

果然,这似乎解决了问题!谢谢!

artf

🙌 那就关门了,谢谢 🙇 ♂️

#62022024年10月9日作者 klipto-inc2 个回答
0 个反应

Javascript CDN 在 Grapejs Canvas 上无法使用

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 129 可复制演示链接 https://grapesjs.com/demo 描述一下那个虫子 const newEditor = grapesjs.init({ fromElement: true, // 允许HTML中的组件 容器:“#editor”, 画布:{ 剧本:[ “https://cdn.jsdelivr.net/npm/[email protected]/dist/preline.min.js”, ], }, 高度:“100VH”, 插件:[ gjsPreset网页, GjsBlockBasic, gjsForms, pluginTooltip...

artf

@klipto-inc,请制作带有正确且可复现的实时演示的错误报告

ClaudeCode

感谢你报告,@klipto-inc。 Javascript CDN 在 Grapejs Canvas 上无法工作的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeS...

#61802024年9月30日作者 padcom4 个回答
1 个反应

Trait 的“setValue()”方法在值变更时不会被调用

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome最新款 可复制演示链接 https://codesandbox.io/p/sandbox/withered-rgb-xmw8gk 描述一下那个虫子 如何复现这个漏洞?开放代码沙盒选择“body”(类型:“wrapper”)——观察从自定义源获取值的警报(调用 trait.getValue()尝试更改值(特质:自定义,唯一存在的)——注意“setValue()”未被调用,因为没有显示警报 预期的行为是什么? 会显示“将全局值设置为” + 值的提醒 目前的行为是什么? 未显示警报,未调用“trait.setValue()”方法。 如果需要执行...

padcom

谢谢!我确认过了,一切正常!

padcom

据我所见,当“Trait.setValue()”值来自输入时不会被调用。取而代之的是调用“setTargetValue()”,但该程序不会检查特征定义中的“setValue()”方法是否存在。另外,'Trait.setValue()' 检查属性中的 'setValue' 键,而 'Trait.getValue()' 通过 'this.get('getValue')' 获得其自定义 getter (Trait.ts:303)

padcom

我尝试按照[这个](https://github.com/GrapesJS/grapesjs/discussions/5793)讨论来让它工作,但正如你在沙盒中看到的,它就是不行。

#61722024年9月25日作者 yashvi20262 个回答
0 个反应

需要在编辑器中支持暗色主题

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 --- 描述一下那个虫子 如果你能在编辑器里切换主题,那就太好了,这样我就能根据喜好在深色和浅色之间切换。行为准则 [X] 我同意遵守本项目的行为准则

artf

请使用讨论区,而不是bug问题

ClaudeCode

谢谢你举报,@yashvi2026。 关于“需要编辑器中暗色主题支持”的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本...

#61712024年9月24日作者 rhoenerSBS2 个回答
0 个反应

:用UndoManager追踪自定义存储

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v129 可复制演示链接 不适用 描述一下那个虫子 你好@artf, 我目前正在用 grapesjs 实现一个编辑器,可以在已有页面旁边添加章节。我实现了一个章节存储,实现了IStorableModule,将章节存储在项目数据中。 我的问题是,让UndoManager跟踪章节更改的最佳方式是什么? 有必要以某种方式扩展ItemManagerModule吗? 行为准则 [X] 我同意遵守本项目的行为准则

artf

大家好@rhoenerSBS请避免打开bug问题。

ClaudeCode

谢谢你举报,@rhoenerSBS。 [问题]:Track自定义存储可用UndoManager的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——...

#61522024年9月18日作者 stpp24 个回答
1 个反应

通过自定义代码添加的CSS在移除自定义代码组件后依然存在

葡萄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 个回答
0 个反应

BUG/[问题]:如何在添加/挂载时正确包装组件?

葡萄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...

浏览所有主题