GrapesJS 问题

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

找到 877 个问题

🔍 question
#42472022年4月7日作者 gustavohleal2 个回答
0 个反应

组件在克隆、移动或添加时消失或未被渲染

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 v96 可复制演示链接 https://grapesjs.com/demo-mjml.html 描述一下那个虫子 如何复现这个漏洞?添加一个单列组件选择列点击工具栏上的复制按钮重复步骤2和3,组件为两列、三列和导航栏链接,嵌入导航栏组件。移动组件或重复步骤3,第一个克隆体会出现 预期的行为是什么? 点击复制按钮时,克隆必须出现在原件的侧面。 目前的行为是什么? 克隆体不会在画布内渲染,而是出现在导出的代码中。 在从这些组件的渲染函数调试时,似乎组件渲染了几步后就消失在grapes.js的函数中。下面的视频展示了一个包含 de navbar 和 n...

artf

抱歉,demo-mjml 是一个插件,与核心无直接关联。因为我没看到组件的默认渲染器存在问题,可能和mjml渲染器有关,我也没有理由让这个问题继续存在。 尽管如此,如果有人能找到问题并且与核心有关,我愿意修复。

ClaudeCode

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

#42422022年4月6日作者 miladmeidanshahi2 个回答
0 个反应

页面的集合名称不起作用

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v100 可复制演示链接 https://jsfiddle.net/9rt1xm6p/ 描述一下那个虫子 如何复现这个漏洞? 在 pageManager 中添加页面并设置名称。 预期的行为是什么? “编辑。Pages.getAll()[0].name' 应该返回页面名,但返回的是“undefined”。行为准则 [X] 我同意遵守本项目的行为准则

artf

属性不会直接放置在实例上。你可以用 'page.getName()' 来获取 name 属性。

ClaudeCode

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

#42402022年4月5日作者 varadero3 个回答
1 个反应

“index.d.ts 不是模块”,在 0.18.4 中,当 grapesjs 被导入时,“import * as grapesjs from 'grapesjs';

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬99 可复制演示链接 没有关联 描述一下那个虫子 如何复现这个漏洞?我在我的typescript angular类中用了grapesjs 0.18.2,导入方式是这样——'import as grapesjs from 'grapesjs';升级至0.18.4版本 预期的行为是什么? 没有错误 目前的行为是什么? Typescript 在“import as grapesjs from 'grapesjs”这行时会抱怨;并出现以下错误: 导入词的“葡萄”部分有红色波浪。我猜这是因为“index.d.ts”是在0.18.4(https://githu...

artf

应该在这里解决 https://github.com/artf/grapesjs/pull/4216 我想你应该在当前版本中禁用TS。

aharishsundhar

@artf 我用的是Grapesjs最新版本 ^0.18.4 我安装了 NPM Grapesjs 来运行,index.d.ts文件上出现了错误,能不能请你更新一下问题 NPM安装: ![截图,2022-06-03 12-12-01](https://user-images.githubusercontent.com/72383148/171802669-b8bde687-a7c4-4a9d-8489-e00d1d3ca165.png) 手动更改本地: ![截图截图,来源于2...

ClaudeCode

谢谢你举报,@varadero。 关于 0.18.4 中 “index.d.ts 不是模块”的好问题,当 grapesjs 导入时,用“import as grapesjs from 'grapesjs';.ProseMirror 推荐的方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “Ja...

#42392022年4月5日作者 codingaddicted1 个回答
0 个反应

在组件优先模式下,同步只有在UI反馈时才第一次生效

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v100 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞?创建文本块在块(文本颜色)中应用样式创建类并同步其值再次编辑颜色至另一个值再次同步 预期的行为是什么? 因为在第3点之后,即使在第5点之后,清晰样式的con颜色字段应该消失,标签状态会切换到“警告” 目前的行为是什么? 第5点以后,职业的数值已正确同步,但清场风格依然有效。此外,按下它会导致一系列无效状态:清晰样式主动 - 同步隐形clear风格pressed清晰样式不可见- 同步可见sync pressed清除样...

ClaudeCode

谢谢你举报,@codingaddicted。 关于在组件优先模式下,同步只在UI反馈下第一次有效,这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => consol...

#42362022年4月4日作者 m-jojo-s1 个回答
0 个反应

粘贴命令不尊重可拖拽/可放置的属性

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome 版本 98.0.4758.80(官方构建)(arm64) 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞?添加“标签”块从新增组件复制标签页将标签贴到组件外的任何位置 预期的行为是什么? 复制的标签页不应该被粘贴到“标签页”组件之外。 复制的组件不应粘贴在无法拖拽或拖拽的地方。 目前的行为是什么? 复制的标签可以粘贴到任何地方。 复制组件的可拖拽/可丢弃属性在粘贴时不被尊重。 应该会在src/commands/view/PasteComponent.js中修复 行为准则...

ClaudeCode

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

#42332022年4月2日作者 clonefunnels1 个回答
0 个反应

从StyleManager插入样式,且带有重要 broken

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://jsfiddle.net/q7cxvpf5/1/ 描述一下那个虫子 当我使用这段代码时,它在一次div更改后就停止工作,之后也不再接受对其他div进行样式更改: editor.on('styleable:change', (model, property) => { const value = model.getStyle()[property]; 如果 (value.indexOf('!important') === -1) { model.addStyle({ [property]: value + ' !im...

ClaudeCode

谢谢你举报,@clonefunnels。 StyleManager中带有 !important broken 的 insert 样式问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复...

#42252022年3月30日作者 Sudhin354 个回答
0 个反应

BUG:Facebook 插件在 Grapes JS 中无法使用

葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome v9可复制演示链接 不是在那里描述一下那个虫子 如何复现这个漏洞?在 React 应用中安装 Grapes js 并运行制作 Facebook 插件组件并导入 Grapes js(从 https://developers.facebook.com/docs/plugins/page-plugin/ 获取 Facebook 页面列表代码)运行应用程序在编辑器中拖放 Facebook 组件 预期的行为是什么? 去掉 Facebook 组件后,编辑器里应该会显示 Facebook 页面 目前的行为是什么? 去掉Facebook组件后,它就不再显示...

Sudhin35

@artf 请帮帮我

artf

我运行 'editor.setComponents(...FB HTML..)` ![Schermata 2022-03-30 alle 16 30 46](https://user-images.githubusercontent.com/11614725/160859671-e8b1bbb7-a1ee-466c-a306-58ffe02944ed.png) 请提供一个可复现的演示。

Sudhin35

@artf 谢谢你的回复 但你已经添加了editor.setComponents(...FB HTML..)默认操作,然后加载编辑器 请创建一个 Facebook HTML 组件,然后在编辑器中拖放该组件,否则加载不了 我就是这样尝试过的

#42132022年3月25日作者 confettidc2 个回答
0 个反应

超大号RTE按钮

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Firefox 98.0.2(64位) 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞? 直接用Firefox访问演示网站 预期的行为是什么? 正常大小的RTE按钮显示(Chrome画面如下): ![圖片](https://user-images.githubusercontent.com/5524183/160108524-a92f13ec-f7a6-4fd2-9c1f-ffe4887c788a.png) 目前的行为是什么? 编辑文本时会出现超大的rte按钮 ![圖片](https:...

artf

这个问题 https://github.com/artf/grapesjs/issues/4176 已经修复了,下一个版本会提供。

ClaudeCode

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

#42082022年3月22日作者 ronaldohoch4 个回答
2 个反应

每个元素的样式点击状态错误

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Brave Last 在 Chrome Last 和 Safari Last 上测试过。 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞?我有个视频:https://www.loom.com/share/508e91098bf247bd93d525f2efa00a36前往演示页面选择任意元素......将状态设置为“点击”编辑任意边界半径保持元素在其他元素中点击第一个bug:界面会变成“点击”状态样式,之后又会切换到正常状态第二个bug:刷新页面,正常刷新或清除缓存,你会看到样式化的“...

artf

谢谢你的报告@ronaldohoch 这个问题将在下一个版本中修复。

ronaldohoch

@artf成功了!谢谢你 😊

ronaldohoch

@artf我没法本地运行,因为有好几个测试都没通过,你也是这样吗?我能尝试修复它们吗? 例如: ![图片](https://user-images.githubusercontent.com/2287371/160130276-227ecfa1-e1cf-459c-971d-590ae684f209.png)

#41962022年3月15日作者 shelendravashishtha24 个回答
0 个反应

在尝试用json在画布上设置组件时,ID会被更改

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 无关联 描述一下那个虫子 如何复现这个漏洞?...使用一个可以在画布上生成组件的演示 json,在属性中设置ID。...use editor.setComponents(json)...设置样式 使用 editor.setStyle() 函数,针对同一 id 元素 预期的行为是什么? ...在画布上渲染时不应该更改ID。 目前的行为是什么? ...ID正在被更改,因此样式无法实现 行为准则 [X] 我同意遵守本项目的行为准则

artf

你好@shelendravashishtha2请你具体说明步骤吗?(我需要知道你说的“json”是什么)

JonathanRiche

我见过如果你在使用 editor.setComponents() 方法之前不保存 CSS 的引用,就会出现这种情况 使用editor.setComponents()方法时,元素id选择器/引用中的所有CSS标记都会被移除 我遇到的具体步骤是把编辑器组件的引用保存成 JSON 格式 'let jsonElements = editor.getComponents().toJSON(); editor.setComponents(jsonElements) ` 使用setCom...

JonathanRiche

我想我是在用 editor.getComponents().toJSON() 找到问题的; 它会在一些组件中添加一个空的“style”:“字段,清理CSS 即 “组件”: [ { “类型”:“框” “风格”:“, “属性”:{ “id”:“ic7c” } }, { “类型”:“框” “风格”:“, “属性”:{ “id”:“if5j” } } ]

浏览所有主题