GrapesJS 问题

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

状态

排序

找到 466 个问题

🔍 components

#48512023年1月17日作者 chaegumi3 个回答

0 个反应

提问组件缺陷 style-manager typescript

This.on（'change：attributes：type'， this.handleTypeChange）不支持数组类型

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Chrome 108.0.5359.125可复制演示链接 https://codesandbox.io/s/frosty-darkness-7po7xl描述一下那个虫子如何复现这个漏洞？使用 myBlock点击测试按钮预期的行为是什么？ this.on（“change：list1”， this.handleList1Change）; 每次都要工作目前的行为是什么？ this.on（“change：list1”， this.handleList1Change）; 只跑一次如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： ![图片]（h...

artf

监听者看不到深度变化，所以这种情况下你得重新创建一个数组 “''js component.set（this.traitName， [...this.items]）; ```

chaegumi

谢谢@artf。我用 JSON.stringify 和 JSON.parse 来处理数据。

GJSBlock

谢谢你举报，@chaegumi。关于this.on（'change：attributes：type'， this.handleTypeChange）不支持数组类型的好问题。推荐的组件方法是使用事件驱动的API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'cha...

查看详情

#48482023年1月16日作者 NicoGGG2 个回答

1 个反应

提问组件缺陷画布 typescript

内联编辑后，组件内容被设置为空字符串

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Firefox v91.4.1 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子如何复现这个漏洞？进入 grapesjs 基础演示：https://grapesjs.com/demo.html清理画布添加组件链接在浏览器控制台中执行 editor.getComponents().models[0].attributes.content 。输出为“链接”，即链接组件的内容通过内联编辑来更改链接文本再次在浏览器控制台执行 editor.getComponents().models[0].attri...

artf

这是与富文本编辑器相关的一些逻辑所预期的。你可以用 'component.getInnerHTML（）' 获取内部 HTML，或者用 'component.components（）' 获取内部组件。

GJSBlock

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

查看详情

#48412023年1月14日作者 chaegumi1 个回答

0 个反应

提问组件缺陷

不要使用 component.addAttributes（{[traitName]：value}），有时应该使用 component.set（traitName， value）

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome 108.0.5359.125 可复制演示链接 https://codesandbox.io/s/sweet-hugle-w00pqx 描述一下那个虫子如何复现这个漏洞？拖我的街区查看代码预期的行为是什么？不想要特征2=“特征2” 目前的行为是什么？具有特征2=“特征2” 如果需要执行某些代码以重现该漏洞，请将其粘贴到下面： ![图片]（https://user-images.githubusercontent.com/9654650/212448739-0f23d7b1-f8bf-49d2-a420-be02a1328...

GJSBlock

谢谢你举报，@chaegumi。关于不要用component.addAttributes（{[traitName]：value}），你有时应该用component.set（traitName，value），这是个很好的问题。GrapesJS 推荐的方法是使用事件驱动 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式...

查看详情

#48372023年1月10日作者 quentin-bettoum4 个回答

4 个反应

组件缺陷提问画布 typescript

HTML元素的ID会在projectData加载的不同页面上递增

GrapesJS版本 [X] 我确认使用最新版本GrapesJS 你用的是什么浏览器？ Firefox 109 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子你好，我注意到当我在 projectData 中加载多个 HTML 中使用相同id的页面时，grapes 会自动在每个页面上递增id，尽管这些页面是不同的。为了演示这个问题，下面有一段代码，我用包含两个页面的 projectData 初始化，grapesjs 页面在某些 HTML 标签上使用相同的 ID。在最终的HTML列表中，你可以看到body和main-title等id在第二页被递增到body-2和main-titl...

artf

嘿，@bgrand-ch，我认为有一天所有Grapesjs实体都会有一个全局“UID”，所以从长远来看，我预计这个问题会被修复 🤞

quentin-bettoum

起初，我想把所有页面一起生成，这样所有页面都能输出一个统一的CSS输出。但现在我尝试另一种风格方案。所以对于“id”问题，分别生成每个页面可能是解决方案。谢谢你的建议。

bgrand-ch

Grapes 使用一些数据属性（类似“data-grapes-id”）作为唯一标识符，以便让 id 留给某些前端脚本使用。我喜欢这个想法 💯

查看详情

#48122022年12月27日作者 FaisalShaikhHA2 个回答

1 个反应

提问组件缺陷 typescript

分层属性在父子关系中无法正常工作。

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 107.0.5304.110（官方构建）（arm64）可复制演示链接 https://codepen.io/faisal-praella/pen/rNvOwgR 描述一下那个虫子当父组件设置为 layerable: false 时，它不可见，其所有子组件在图层管理器中也不可见。当其子组件被设置为 layerable: true 时，图层管理器中应该能看到。预期的行为是什么？父组件和子组件应该隐藏，但带有 layerable: true 的子组件应在图层管理器中可见。目前的行为是什么？带有 layerable: true 的子节...

artf

不幸的是，这就是目前“可分层”的机制，所以不是bug，但我很乐意接受一个PR以改善这种行为。

GJSBlock

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

查看详情

#48032022年12月25日作者 miladmeidanshahi1 个回答

0 个反应

提问组件 typescript 缺陷

Traits value type select doesn't fill value

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome 108 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子如何复现这个漏洞？使用工具提示组件，通过 editor.getSelected().getTraits() 获取特质，你可以看到 data-tooltip-length 值是空的，设置面板设置后会填满该值，但重新刷新页面后值却是false。其他类型如布尔值和文本填充值，即使刷新页面后，我觉得所选类型出了问题。所有使用select-type特性的组件都会出现这种情况。 ![截图来自2022-12-25 12-45 12-45...

GJSBlock

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

查看详情

#48012022年12月23日作者 eduardocalixtokorp2 个回答

1 个反应

提问组件缺陷 typescript

React components componentWillUnmount is not called

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Chrome 108.0.5359.125（Windows）可复制演示链接 https://codesandbox.io/s/white-meadow-o56l2d?file=/src/Chart/Chart.js:135-254 这个演示不在最新版本 grapesjs 里，但在本地使用最新版本时，我遇到了同样的bug。描述一下那个虫子如何复现这个漏洞？访问此[链接]（https://codesandbox.io/s/white-meadow-o56l2d?file=/src/Chart/Chart.js:135-254）打开控制台拖拽“图表...

eduardocalixtokorp

我注意到在我的组件定义中，我正在做 'reactRoot.render（<>{reactEl} </>）' 在onRender（）中，我之前遗漏了补充 'root.unmount（）' n remove（）方法

GJSBlock

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

查看详情

#48002022年12月23日作者 usmanqamar-int2 个回答

0 个反应

提问组件缺陷 typescript

移除或添加组件会改变其他组件位置，但用拖拽模式翻译，有什么解决办法吗？

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？铬可复制演示链接 https://zmzr3n.csb.app/ 描述一下那个虫子如何复现这个漏洞？在删除或添加多个组件时，其他组件的位置发生了变化。预期的行为是什么？这不应改变他们的立场行为准则 [X] 我同意遵守本项目的行为准则

artf

这就是翻译的原理，另一种选择是使用绝对模式

GJSBlock

感谢你举报，@usmanqamar-int。关于移除或添加组件会改变其他组件位置的拖拽模式翻译，有没有解决办法？推荐的组件方法是使用事件驱动的API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'somet...

查看详情

#47962022年12月21日作者 RakulAgn2 个回答

0 个反应

组件 style-manager typescript 性能

Custom Traits not Updating if using mjml

这种方法对普通HTML来说是正常的。但当我尝试用MJML来标记MJ-IMAGE标签时， SRC在TR标签中是更新的，但在TR标签内的img标签中没有更新下方图片 ![截图来自2022-12-21 13-32-13（1）]（https://user-images.githubusercontent.com/119593989/208852368-33fc6704-88e4-4ac0-8f9c-9c022efd67cb.jpg） Originally由@RakulAgn在 https://github.com/artf/grapesjs/discussions/4795发布

artf

@RakulAgn请避免在讨论中制造问题。

GJSBlock

谢谢你举报，@RakulAgn。感谢你分享关于使用mjml时自定义特征未更新的报告。为了帮助团队调查并优先排序：请提供：一个最小可复现的例子（CodeSandbox/JSFiddle）你的GrapesJS版本号浏览器和操作系统信息浏览器控制台的任何错误信息重现问题的步骤最有帮助的是什么：简约代码示例（不是你整个项目）屏幕录制或截图显示问题明确区分预期行为与实际行为你正在使用的GrapesJS配置有了这些细节，维护者可以更快地识别和优先排序修复。Gr...

查看详情

#47922022年12月19日作者 wunksert4 个回答

0 个反应

组件提问缺陷 style-manager typescript

Drag and drop broken in 20.2

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Chrome v108可复制演示链接见下文描述一下那个虫子如何复现这个漏洞？创建自定义组件将其作为组件和可拖拽块添加到编辑器中在组件添加时将编辑器设置为绝对拖拽模式，丢弃组件后再将该组件本身设为绝对拖拽模式。重置编辑器预期的行为是什么？组件保持在放置的位置（这在 v 0.20.1 中正常工作）目前的行为是什么？组件会吸附到屏幕右侧（这种行为是在0.20.2版本中新增的）行为准则[X] 我同意遵守本项目的行为准则

wunksert

确认它在 v0.20.1 中仍然有效，所以看起来回归是在 v0.20.2 引入的

wunksert

组件一旦添加到画布中，也无法再拖曳。

artf

我会为下一次发布准备修复方案。

查看详情

GrapesJS 问题

浏览所有主题