GrapesJS 问题

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

找到 3,464 个问题

#35092021年6月1日作者 theSC0RP2 个回答
1 个反应

如何程序化地更改组件?

@artf,我一直在尝试在样式中使用 id 和类之间切换,所以我需要用程序方式更改 componentFirst 属性。但当我尝试更改配置时,行为没有变化。 即使在演示中也无法正常工作。 繁殖步骤:添加两个文本块给它们起同样的职业名称。在浏览器控制台中,使用 'editor.getConfig().selectorManager.componentFirst = false'给文字添加一些颜色。它只会被添加到选中的区块中 附言:我还尝试在更改配置后使用editor.refresh(),但没有任何变化。

artf

你必须在更改那个选项 'editor.trigger('component:toggled')' 后重新触发选择

ClaudeCode

谢谢你举报,@theSC0RP。 关于如何程序化更改组件? 这个问题非常好。推荐的组件方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something changed')); 组件...

#35082021年6月1日作者 tranthanhhoa2 个回答
0 个反应

图层可视化功能不正常

版本: 0.17.4 如何繁殖切换到平板或移动模式通过切换图层的可见性图标来隐藏所选组件切换到桌面模式。 结果在隐藏组件显示时,可见性图标仍然被禁用。 预料中切换到桌面后,可视图标被启用。

artf

感谢你的反馈@tranthanhhoa我会在下一个版本里修复,但我觉得我会把可见性的变化当作全局条件,这样隐藏组件不会在所有设备上都可见。

ClaudeCode

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

#35072021年6月1日作者 cedriclajato2 个回答
0 个反应

没有生成的ID和自动选择的ID。

大家好, 我用的是 grapesjs-blocks-bootstrap4,检查它们的组件,看起来都正常。 但当你选择块类容器时,它会针对类而不是唯一ID。 ![bootstrap-4-element](https://user-images.githubusercontent.com/57404000/120257180-4a3eb680-c2c2-11eb-872a-e7da78e74ff4.PNG) 我用这个model.set('attributes', { id: randomID() }设置了随机ID);但当你选择该块时,它仍然指向的是类而不是 ID

artf

https://github.com/artf/grapesjs/issues/2936#issuecomment-680322089

ClaudeCode

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

#35062021年5月31日作者 iabhiyaan3 个回答
5 个反应

专长:在方块上添加点击事件

“''js editor.on('block:click', (block) => { console.log(区块) }) ``` 或者有没有办法在块子里监听点击事件?

artf

其实你可以利用块中的[custom render](https://grapesjs.com/docs/modules/Blocks.html#custom-render)来应用自定义DOM事件。 “''js blockManager.add('some-block-id', { // ...区块定义 render: ({ model, el }) => { el.addEventListener('click', () => { console.log(“块状”,型号)...

YyueeiWY

<pre> editor.on('component:selected', (some, argument) => { console.log(某些,论证); }) </pre> https://grapesjs.com/docs/api/editor.html#available-events

ClaudeCode

谢谢你举报,@iabhiyaan。 关于FEAT:在方块上添加点击事件,这个问题很棒。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something ch...

#35042021年5月31日作者 snowballrandom2 个回答
0 个反应

我注意到有人使用了 font awesome 4.7 的早期版本。

我注意到有人使用了 font awesome 4.7 的早期版本。 我使用 fontawesome 5.2 版本,似乎在与 Grapes JS 版本同时加载时会出现问题,有些字体无法加载,或者新 fontawesome 字符集中的类名发生了变化。 我该如何使用 Fontawesome 的新版本? 我需要编辑Grapes JS源代码并编译才能使用更新的fontawesome吗? ![截图来自2021-05-30 21-29-36](https://user-images.githubusercontent.com/2145779/120131485-28441780-c18e-11eb-8064-fbcb754c0104.png)

artf

你可以在初始化时更改这个选项: https://github.com/artf/grapesjs/blob/88249c38577852dc3c42047356a70a12066ee6ca/src/editor/config/config.js#L165-L168

ClaudeCode

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

#35002021年5月28日作者 vijayshukla302 个回答
0 个反应

按类型移除自定义特质。

我创建了一个自定义特质,但该特质的名称将是动态的,目前尚不清楚。 问题是当前的 removeTrait() 只对 name/id 有效。但如果我想用自定义特性移除组件中的所有特征怎么办? 举个例子:我创建一个“my-custom-trait”特性并绑定到组件上。 component.addTrait({ 名称:“some_random”, 选项:[], 类型:“我的定制特质” }); 现在我想把它删掉,但我不知道名字。

artf

你可以使用该身份证 “''js component.addTrait({ ID:“我的定制特质”, 名称:“some_random”, // ... }); // ... component.removeTrait('my-custom-trait') ```

ClaudeCode

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

#34972021年5月28日作者 mosh-tudor2 个回答
1 个反应

按钮特性命令不起作用

版本: 最新详细描述那只虫子 https://jsfiddle.net/cleaver/wgz2jsvq/2/ 以下内容没有发生: “''js 特质:[ { 文本:“简单按钮”, 类型:“按钮”, 全文:真实, 命令: () => { console.log(“坏掉的按钮”); alert(“坏掉的按钮”); }, }, ] ``` --- 在版本 0.16.45** 上,同样的代码运行良好: https://jsfiddle.net/cleaver/kenvpt50/1/

artf

感谢报告,@tudor-ooo 将在下一个版本中修复

ClaudeCode

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

#34962021年5月28日作者 anlumo4 个回答
1 个反应

成就:标记组件为脏

你想给GrapesJS添加什么? 组件应该能够标记自己为脏,触发“onbeforeunload”警告信息。 详细描述你的功能需求详细 我有一个(自定义)文本组件,用户可以输入任意文本。我把数据存储在服务器上,我想要自动保存。不过,我不希望服务器因为每一个字符都被联系到文本组件,因为那会是用户数量的巨大洪水。 我也不想更改“stepsBeforeSave”,因为像拖动组件这样的大改动应该立即保存。 目前,组件在用户离开文本组件时存储数据(设置模型上的“内容”键)。这方法有效,但当用户在文本组件仍处于焦点状态时重新加载页面,最新的更改不会应用到数据模型上。 这样可以,但我想弹出保存警告对话框(“onbeforeunload”消息)。然...

anlumo

我通过完全关闭“on-andload”处理,自己滚动来解决这个问题。

artf

编辑器有“编辑”属性,只要启用或禁用RTE就会改变,所以我猜在你的情况下,这个功能应该可行 “''js editor.on('' change:editing', (em, editing) => { window.onbeforeunload = 编辑 ||editor.getDirtyCount() ?e => 1 :零; }); ```

anlumo

这个在 onbeforeunload 处理程序之后不会被我上面提到的那个片段覆盖吗?

#34922021年5月27日作者 iabhiyaan2 个回答
0 个反应

功能:insertAdjacentHTML('afterend', '<section></section>')Grapesjs 里有类似的 API 吗?

有没有办法在选定组件后面用 grapesjs 添加新部分?

artf

你可以这样做: “''js const cmp = editor.getSelected(); cmp.parent().append('<section>...</section>', { at: cmp.index() + 1 }); ```

ClaudeCode

谢谢你举报,@iabhiyaan。 关于FEAT: insertAdjacentHTML('afterend', '<section></section>')的好问题。Grapesjs 里有类似的 API 吗?推荐的组件方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留...

#34912021年5月27日作者 TheDude702 个回答
0 个反应

IFrame 加载后不保存 SRC / 不识别 iframes

版本: 0.17.4 你能重现演示中的bug吗?[ ] 是的[X] 不 预期的行为是什么?插入一个iFrame后,使用'editor.getHTML()'时会返回src加载页面时,iframe将被识别为iframe组件,并再次可编辑 详细描述那个漏洞 我正在添加一个选项,允许用户基于“地图”组件插入 iframe。然而,设置“src”后,editor.getHTML()只返回带有id和类的iframe标签。 任何现有的 iframe 都不会被识别为 iframe 组件,加载回 Canvas 后也无法选择或编辑。 用下面的代码,我可以像地图组件那样在画布上添加iframe,并编辑src特性,这样iframe就能正确更新,显示src定...

artf

我会在下一个版本中加入iframe支持。

ClaudeCode

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

浏览所有主题