GrapesJS 问题

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

状态

排序

找到 3,464 个问题

#45062022年8月10日作者 tyuterry4 个回答

0 个反应

Error on drag block with dragmode: absolute

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome v103 可复制演示链接 https://stackblitz.com/edit/js-1xpo7b 描述一下那个虫子如何复现这个漏洞？使用dragMode：绝对（设计师模式）从块管理器中拖拽块无法在[JSFiddle]（https://jsfiddle.net/g1reyutd/）上复现，但我不知道怎么做。我猜是CDN grapesjs npm版本 grapesjs不同。预期的行为是什么？没有错误，编辑器也没有卡住目前的行为是什么？控制台错误：编辑器未定义，编辑器卡住 ![1660117887338]（http...

artf

谢谢@tyutony问题已经修复了（https://github.com/artf/grapesjs/pull/4487）。不幸的是，现在唯一的解决办法是全局暴露“编辑器”实例（'window.editor = grapesjs.init（{...}）`)

wunksert

@tyutony我也遇到同样的问题，你找到解决办法了吗？看起来这个bug还没修复

artf

@wunksert修复了但还没发布（新版本很快就会发布）

查看详情

#45032022年8月5日作者 gustavohleal4 个回答

0 个反应

提问缺陷 style-manager 组件增强

CKEditor 在添加原始 HTML 组件时使用的缺少内联样式

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？铬 v96 可复制演示链接 https://grapesjs.com/demo-newsletter-editor.html 描述一下那个虫子如何复现这个漏洞？在控制台标签页打开开发者工具运行下面的代码选择新增的文本用CKEditor编辑内容选择另一个组件预期的行为是什么？预计会从文本组件内的跨度添加内联样式，这样CKEdittor就能理解文本样式，并在打开时保留这些样式。目前的行为是什么？添加原始 HTML 时， editor.addComponent() 确实添加了样式，但一旦你编辑文本并模糊，样式就会从它们应有的文本段落中移...

shkhalid

pety-dc

嘿我也遇到过类似的问题。我认为情况相当严重，因为通讯和 mjml 演示版都受到了影响。（两者都使用 CKeditor 作为 RTE）当我导入包含带有样式元素（span）的文本（mj-text）的内容时，导入的内容会被解析，样式元素被识别为独立组件，而不是作为换装文本元素的内容。示例（根据 mjml.io 有效）：预期结果： ![图片]（https://user-images.githubusercontent.com/25766885/230409523-b8b57...

raymondmakz

CKeditor 输出： '<div><span style=“color：blue”>ckeditor 中的部分富文本</span></div>” 解析到编辑器后，可以变成： '<div data-gjs-type=“text”>来自 <span 的一些富文本 style=“color：blue” data-gjs-type=“default”>ckeditor</span></div>' 基本上每个主导者都变成了组成部分。也许可以让开发者选择是否停止添加子节点作为组件...

查看详情

#45012022年8月5日作者 udayan462 个回答

0 个反应

缺陷提问常规

[X] 我确认使用最新版本 GrapesJS

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？铬可复制演示链接无演示链接描述一下那个虫子你好@artf，能帮我检查这两位吗无法在编辑器中手动添加颜色代码 grapesjs 导入模态没有任何存档选项行为准则 [X] 我同意遵守本项目的行为准则

artf

如果你无法提供可复现的演示，请不要打开BUG问题。

GJSBlock

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

查看详情

#44982022年8月4日作者 ajjuyadav02092 个回答

0 个反应

提问缺陷常规

Seeing Multiple pages on scroll

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？勇敢可复制演示链接 https://codepen.io/etamity/pen/NWpKYPp 描述一下那个虫子如何使用 pageManager 在 Onscroll 中查看多个页面？行为准则 [X] 我同意遵守本项目的行为准则

artf

请使用讨论区提问

GJSBlock

谢谢你举报，@ajjuyadav0209。关于在滚动时看到多个页面的好问题。GrapesJS 推荐的方法是使用事件驱动 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something change...

查看详情

#44972022年8月3日作者 benryanwilliams4 个回答

3 个反应

缺陷提问组件画布 typescript

从 v18.4 更新到 GrapesJS v19.5 会导致 Chrome 变得无响应

GrapesJS版本[x] 我确认使用最新版本GrapesJS你用的是什么浏览器？ Chrome 104.0.5112.79可复制演示链接 https://jsfiddle.net/gvrnw2c3/4/描述一下那个虫子如何复现这个漏洞？我目前无法用 jsfiddle 重现这个 bug，这让我觉得可能是 Chrome 的问题，但我会继续尝试重现。 Within我的项目，如视频所示： 1）点击一个“条件文本”组件（我添加了的自定义组件类型） 2）点击“打开条件”按钮，然后在屏幕上出现的对话框中点击“应用” 3）将光标悬停在“条件文本”组件上 In JSFiddle（目前没有崩溃，但我会继续测试）： 1）点击“Hello Worl...

tyuterry

小提琴（vue）的复刻版没有Vue我无法复制 [小说]（https://jsfiddle.net/6qp48xyn/）重现问题的步骤：添加文本组件选择文本组件，然后点击底部的“转换为条件”按钮将鼠标悬停在条件文本组件上，然后它会冻结。好像有什么东西总是在悬浮上一直触发 ![图片]（https://user-images.githubusercontent.com/30591406/184062993-73d84ef7-0c07-4832-bd7b-9ac6d3851a...

artf

谢谢大家，我其实通过在Vue里打包这个示例还原了它，但我不太清楚为什么会被困在这个循环里。乍一看，似乎与Vue的Proxy观察者有关。通过与之前的 Grapesjs 版本对比，似乎并非所有部分都被 Proxies 转换，这避免了卡住。一个快速的变通方法是把“编辑器”放在Vue之外，防止所有对象都变成代理。 “''js 让编辑; Vue.createApp（{ mounted（） { editor = grapesjs.init（{ ... }）; // ... }, /...

benryanwilliams

谢谢@artf，现在在Vue实例外声明编辑器后，一切都完美运行了。

查看详情

#44962022年8月3日作者 bovealexandre4 个回答

0 个反应

提问 style-manager 缺陷 typescript

SetStyle

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Chrome 最新版本可复制演示链接没有，因为它有太多React等自定义代码描述一下那个虫子如何复现这个漏洞？用 setStyles 向编辑器添加更多样式这是我在 setStyles 里用过的字符串预期的行为是什么？在编辑器中添加多种样式目前的行为是什么？只加那些孩子，更奇怪了所以目前只添加了这些如果需要执行某些代码以重现该漏洞，请将其粘贴到下面：无需代码测试，只需 edit API 中的 setStyle 即可行为准则[X] 我同意遵守本项目的行为准则

bovealexandre

当我试图添加这个时它只是增加了这一点

artf

@bovealexandre至少提供一个简易可复现的例子，因为从我目前看到的情况来看，可能是你的自定义代码导致的

bovealexandre

@bovealexandre至少提供一个最小可复现的例子，因为据我目前看到，可能是你的自定义代码导致的好的，我刚刚在我的scss编辑器上做了editor.getCss（{ keepUnusedStyles： true }

查看详情

#44952022年8月3日作者 TechyMS1 个回答

0 个反应

提问组件缺陷

Button component is not working

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？铬可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子预期的行为是什么？按钮组件不工作。行为准则 [X] 我同意遵守本项目的行为准则

GJSBlock

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

查看详情

#44892022年7月30日作者 contentfree4 个回答

0 个反应

画布缺陷提问 typescript

从设计模式项目加载初始项目数据会导致画布大小错误

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome v103 可复制演示链接 https://codesandbox.io/s/laughing-austin-k12mc3?file=/index.js 描述一下那个虫子如果你查看链接的CodeSandbox并找到注释显示的projectData行，你会发现画布的大小被调整成了设备指定的大小。在调试器中， updateDim 初始化时似乎会多次调用：第一次是正确的设备大小，第二次是空的宽度和高度，这导致gjs帧封装器的尺寸被移除。行为准则 [X] 我同意遵守本项目的行为准则

contentfree

我可以通过以下方式强制调整到正确的画布尺寸：初始配置中未提供 projectData，通过“editor.loadProjectData（...”）加载 projectData（...）在初始化和然后运行编辑器。Canvas.getModel（）.updateDevice（）;'虽然它会从全宽动画回到设备大小。看起来加载项目数据是在默认设备渲染（可能）之后，某种程度上会压缩当前帧，重新渲染一些默认画面。（我不知道默认配置是什么，因为我只提供了一个设备配置，而第二个渲染时似...

artf

谢谢@contentfree我会尽量在下一次发布时修复这个问题

contentfree

谢谢@artf。我会留意下一次发布（看起来你的看板现在空了......所以应该很快就会被发现？）

查看详情

#44812022年7月27日作者 skru2 个回答

0 个反应

缺陷组件提问 typescript

V0.19.5 Breaks headless editor.setComponents() (with Map/Video block)

GrapesJS版本 [X] 我确认使用最新版本GrapesJS 你用的是什么浏览器？ Chrome 102.0.5005.115（官方版本）（64位）可复制演示链接描述一下那个虫子这是#4473的延伸在无头环境中通过editor.setComponents（）添加地图或视频块时，也会出现类似的“文档未定义错误”，源自./src/dom_components/model/ComponentImage.js，parseUri（）尝试使用文档对象。我不得不迅速修复，因为它是产品发布的瓶颈。我重构了 parseUri（）方法，使其看起来像这样（测试通过且无错误）： parseUri（uri） { let uriParams...

artf

谢谢@skru我其实已经处理好了 parseUri [这里]（https://github.com/artf/grapesjs/commit/f61222ec904ed56794f7b97e362ea2006dfceaf6），所以下次发布应该能用

GJSBlock

谢谢你举报，@skru。 v0.19.5 导致 headless editor.setComponents（）（带地图/视频块）的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：如果还没测试过，请用最新的GrapesJS版本测试提供最小可重复...

查看详情

#44802022年7月26日作者 ValouZ2 个回答

0 个反应

提问缺陷画布组件 typescript

Iframe on a block can't be edited

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Firefox v102.0.1 可复制演示链接这是工作代码，我不能...... 描述一下那个虫子如何复现这个漏洞？拖放到页面块视频你会发现你对我的iframe无能为力预期的行为是什么？我希望iframe的src可以编辑目前的行为是什么？ iframe没法用。我在图层管理器上能看到Iframe，但如果我打开检查器，只有包含Iframe的部分。这东西在两三周前还很糟糕，我去度假了，没人碰它，因为只有我一个人在修，现在它坏了。如果需要执行某些代码以重现该漏洞，请将其粘贴到下面：希望你能帮帮我，非常感谢！行为准则 [X] 我...

artf

感谢@ValouZ的报告，iframe视图上确实有个拼写错误。我会在下次发布时处理好。

GJSBlock

谢谢你举报，@ValouZ。关于Iframe在一个区块上不能编辑，这个问题问得很好。推荐的 Canvas 方法是使用事件驱动的 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something ch...

查看详情

GrapesJS 问题

浏览所有主题