GrapesJS 问题

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

找到 3,464 个问题

#31492020年11月21日作者 MarksEliel2 个回答
0 个反应

重载编辑器中的背景图层为空

版本:最后 演示中没有出现这个bug,我认为是因为使用localstorage进行存储。 Grapesjs 在背景时正常工作,但当我插入背景图层时,所有内容都显示正确。 问题是当我重新加载编辑器时,它不会显示已创建的图层,但所有内容都正常显示,问题是无法再次编辑,因为图层不会出现。 更多详情请观看视频。 https://youtu.be/F_YRlJpONSM

artf

在演示中没有出现这个bug,我认为是因为使用localstorage来存储。 不,使用本地存储和远程存储没有区别,因为使用的 JSON 结构是相同的。 确实,我猜你是在回加载 HTML,而不是 JSON(正如这里 https://grapesjs.com/docs/modules/Storage.html#store-and-load-templates 解释的那样)

ClaudeCode

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

#31462020年11月19日作者 fahadali14 个回答
2 个反应

启用RTE需要多次点击,我能用单击编辑文本吗?

启用RTE需要多次点击,我能用单击编辑文本吗? 我尝试过添加属性 contenteditable,但存储管理器无法识别文本更改,请帮帮我。

artf

你可以扩展文本组件视图,并用点击触发onActive,而不是dblclick。 https://github.com/artf/grapesjs/blob/d3256e621bb43a537213ffcd86b10dc0bd070c0b/src/dom_components/view/ComponentTextView.js#L7-L10

antoineando-zenchef

@vidhii16 @fahad157 我用这段代码让它成功了: <img width=“758” alt=“image” src=“https://github.com/user-attachments/assets/2f9418e8-66f4-43ef-a5ac-428ede52e8a9” />

fahad157

@artf我试过改成点击,但对我来说不行,请帮帮我。 ![图片](https://user-images.githubusercontent.com/80100955/111276504-35ef0400-8659-11eb-8507-968d8b71eaf1.png)

#31452020年11月17日作者 sashapawlow7262 个回答
0 个反应

专长:如果按钮有动作(比如打开模态窗口)该如何编辑?

我有一个HTML模板。HTML模板有一个按钮。点击按钮时,会触发一个事件(打开模态窗口)。有没有可能在不触发事件的情况下,直观地改变按钮的外观?使用 allowScript: 0,我可以编辑按钮的外观,但在这种情况下,事件不会触发(打开模态窗口)。在 allowScript: 1 中,触发事件(打开模态窗口),但无法编辑按钮的外观。曾有过在allowScript 0和allowScript 1之间切换的想法,但allowScript会移除页面上的所有js。

artf

如果按钮需要自定义逻辑/行为,你必须为该按钮创建一个[自定义组件](https://grapesjs.com/docs/modules/Components.html),并且需要根据原始HTML的自定义逻辑

ClaudeCode

谢谢你举报,@sashapawlow726。 关于FEAT:如果按钮有动作(打开模态窗口)如何编辑按钮,这真是个很棒的建议?!虽然这个具体功能还没有出现在核心 API 中,但有几种方法可以实现类似的行为。 使用事件系统: “JavaScript editor.on('component:update', (component) => { 你的逻辑 }); ``` 替代方法: 听取“selector:add”以获取CSS选择器更改 使用“selector:custom”来表示...

#31442020年11月17日作者 antman33512 个回答
0 个反应

交换默认工厂

你好,我用GrapesJs模板打印HTML,所以我需要毫米的尺寸。 有没有办法在StyleManager里切换默认出厂设置?也许可以把它放进选项里? 谢谢, 安东尼奥

artf

不,你不能,你只需要在 StyleManager 配置中配置属性(示例配置可以在这里找到 [https://grapesjs.com/docs/getting-started.html#style-manager)])。

ClaudeCode

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

#31432020年11月15日作者 sprklinginfo2 个回答
0 个反应

隐藏内部组件的工具栏

默认情况下,当选中组件时,工具栏会显示“移动、复制、删除”等操作,并设置“showToolbar: 1”选项。当我定义一个可能包含多个内部组件的自定义组件时,我想隐藏这些内部组件的工具栏。我不想在 grapesjs.init() 中全局隐藏它。谢谢,

artf

定义组件后,你可以自定义工具栏数组 “''js 默认值:{ ... 工具栏:[], // 这将阻止其在组件上的渲染 } ```

ClaudeCode

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

#31422020年11月14日作者 mohd74693 个回答
0 个反应

AssetManager 渲染问题

@artf这正是之前已经被解决过的[问题#2760](https://github.com/artf/grapesjs/issues/2760),这是错了还是我做错了?我本以为资源不会显示出来,但它们全都可见 ![图片](https://user-images.githubusercontent.com/12613564/99156432-99d0e280-26e2-11eb-8289-d76d66af2ad1.png) 这是我的代码,我使用的是“Grapesjs”的版本:“^0.16.27”, ![图片](https://user-images.githubusercontent.com/12613564/99156485-04...

artf

@awais786327请提供该问题的现场演示

no-response[bot]

由于我们请求原作者提供更多信息未获回应,本期已自动关闭。仅凭当前期刊中的信息,我们没有足够的信息采取行动。如果您有答案或找到我们需要的答案,请随时联系我们,以便我们进一步调查。

ClaudeCode

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

#31412020年11月14日作者 webdevhayes3 个回答
0 个反应

加载动态内容

如果之前有人讨论过,我真的很抱歉。我已经搜索过相关问题,也仔细阅读了文档,也许我理解得不对。 我知道你可以在页面构建器里运行脚本加载内容,但当我点击保存后,内容/HTML会被保存吗?这意味着前端会加载过时的内容或HTML吗? 你能指点我去更深入理解这一点,并且让内容始终通过 ajax 调用动态加载吗?我用的是Laravel,存档功能都正常。 如果之前已经讨论过,再次抱歉。

artf

我觉得你必须读读[这份指南](https://grapesjs.com/docs/modules/Storage.html)

anuragk15

你找到解决办法了吗? 我也有类似的问题。比如,当我写博客并存储在数据库中时,现在每当有人访问我的落地页(用Grapesjs制作),我希望他们能看到我最新的博客。另外,如果有终端用户访问网站,我只需要发送 Grapejs 的 html 和 css 对吧?没有组件?

ClaudeCode

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

#31402020年11月13日作者 ZeroCoolHacker2 个回答
0 个反应

画布中的交互组件

我正在用 Grapesjs 开发一个测验生成器插件。我在想我们是否可以添加一个组件,它是交互式的,点击后会添加新的组件。 例如: ![图片](https://user-images.githubusercontent.com/18724529/99068996-56d21a80-25cf-11eb-8aa7-29ca26ac4e6c.png) 大概是这样的。当丢弃时,没有输入,但点击“添加新字段”时,输入会出现。 可能吗?怎么做?

artf

你必须[扩展自定义组件的视图](https://grapesjs.com/docs/modules/Components.html#view)

ClaudeCode

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

#31392020年11月13日作者 adamwpe3 个回答
0 个反应

天赋:禁用存<table>档时自动修改功能

我遇到了一个问题,当保存自定义HTML组件(只是一个表格)时,Grapes JS会修改它。 保存之前 ![图片](https://user-images.githubusercontent.com/49768920/99049128-62512180-258e-11eb-9213-10bc30c037b0.png) 存档之后。 ![图片](https://user-images.githubusercontent.com/49768920/99049054-464d8000-258e-11eb-9545-726b0348fa4c.png) 所以我想能够插入一个表格,因为我想用 twig(一种模板语言)进行门通 : 我相信它和#60...

adamwpe

啊,如果我用这个 https://github.com/artf/grapesjs-custom-code,保存时不会修改 html。 但使用“gjs-preset-newsletter”时,这个方法无法实现。 因为如果你运行命令 'gjs-get-inlined-html',它会修改代码。 E.g. HTML代码: 运行 'gjs-get-inlined-html',它输出: 我猜你没办法阻止这种情况吧?

artf

你不能插入无效的HTML。如果你需要处理这些,你必须创建一个[自定义组件](https://grapesjs.com/docs/modules/Components.html),然后它会输出自定义代码。

ClaudeCode

谢谢你举报,@adamwpe。 关于FEAT:关闭<table>存档时自动修改的好建议!虽然这个具体功能还没有出现在核心 API 中,但有几种方法可以实现类似的行为。 使用事件系统: “JavaScript editor.on('component:update', (component) => { 你的逻辑 }); ``` 替代方法: 听取“selector:add”以获取CSS选择器更改 使用“selector:custom”来表示自定义规则 利用“change:*”事...

#31382020年11月13日作者 adamwpe2 个回答
0 个反应

避免<TABLE>在保存过程中被修改。

大家好, 我遇到了一个问题,当保存自定义HTML组件(只是一个表格)时,Grapes JS会修改它。 保存之前 ![图片](https://user-images.githubusercontent.com/49768920/99049128-62512180-258e-11eb-9213-10bc30c037b0.png) 存档之后。 ![图片](https://user-images.githubusercontent.com/49768920/99049054-464d8000-258e-11eb-9545-726b0348fa4c.png) 有没有可能把什么东西包裹起来,避免被修改?问题的原因是我用 twig(一种模板语言...

adamwpe

替换为#3139

ClaudeCode

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

浏览所有主题