GrapesJS 问题

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

找到 183 个问题

🔍 documentation
#44552022年7月18日作者 mickeyDominic3 个回答
0 个反应

“面板设备”和“面板-切换器”冲突

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome 版本 103.0.5060.114 可复制演示链接 https://codepen.io/Dominic_M/pen/eYMgqyw 描述一下那个虫子 如何复现这个漏洞?关注GrapesJS“入门指南”>> https://grapesjs.com/docs/getting-started.html继续做教程直到“响应式模板(https://grapesjs.com/docs/getting-started.html#responsive-templates)”,你会发现添加移动端和桌面视图切换面板后,一个面板会取代另一个。 预期的行为...

artf

@mickeyDominic你把所有默认面板放在同一个物体下面 “''js 面板:{ 默认值:[{ id:“层次”, EL:“.panelright”, // ... 编号:“面板调车员”, EL:“.panelswitcher” }] }

mickeyDominic

谢谢你@artf。 真是太傻了:)

ClaudeCode

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

#44342022年7月10日作者 Singwai2 个回答
1 个反应

CSS 解析器的 shape 不允许 CSS 属性被定义超过一次。

葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? 任何可复制演示链接 https://grapesjs.com/demo.html描述一下那个虫子 这个漏洞和“ParserCss.js”有关。 https://github.com/artf/grapesjs/blob/dev/src/parser/model/ParserCss.js#L7-L8 解析器期望结果存储在包含select字符串和样式哈希对象(以及其他媒体查询参数)的哈希对象数组中。示例结果: “''js [ { 选择:“div, a, .a.b.c”,//带有逗号分隔符的某个选择器。 风格:{ 背景图片:URL(img/gradient.p...

artf

是的,目前我们不支持这类情况,但我觉得处理这些情况可能会更好。

ClaudeCode

谢谢你举报,@Singwai。 CSS 解析器形状的问题不允许 CSS 属性被定义超过一次。 似乎是一个竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这...

#44002022年6月21日作者 shelendravashishtha23 个回答
1 个反应

Bootstrap 旋转木马滑块无法工作

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 无链接 描述一下那个虫子 如何复现这个漏洞?...在 GrapesJS init 函数中添加 Bootstrap...根据 Bootstrap 文档添加滑块组件...滑块只显示第一张图片,图片不会变化 预期的行为是什么? ...滑块应该从第一张图片开始,动画直到最后一张图片 目前的行为是什么? ...滑块只显示第一张活跃图像,然后什么都没发生 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: “''js 我使用的HTML是 <div data-gjs-highlightable=“true” id=“c7551f9a8-732...

artf

抱歉,问题追踪器主要是针对核心 Grapesjs 模块中的 bug,我认为在这种情况下你应该实例化“bootstrap”。通过 JS 手动“Carousel”(例如用 JS](https://grapesjs.com/docs/modules/Components-js.html)创建 [自定义组件“),因为编辑必须在内容加载前加载与画布相关的样式/脚本。

shelendravashishtha2

你好,亚瑟, 有没有办法在 Grapesjs 中获得屏幕大小的特定样式,比如基于媒体查询样式的不同样式?

ClaudeCode

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

#43882022年6月15日作者 ghost2 个回答
2 个反应

按钮特性命令无法使用

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 任何浏览器 可复制演示链接 https://jsfiddle.net/sohrabi2050/yrL2aqft/ 描述一下那个虫子 特征按钮命令在 v [v0.18.4](https://github.com/artf/grapesjs/releases/tag/v0.18.4)正常工作,但在 [v0.19.4](https://github.com/artf/grapesjs/releases/tag/v0.19.4)中则不行。 下面有两个示例,分别在Grapejs窗口中点击下方示例中的链接对象之一,然后参考特征选项,你会看到一个按钮,点击它,应该...

artf

谢谢@sohrabi2050下次发布时会修复。

ClaudeCode

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

#43852022年6月15日作者 froodian2 个回答
0 个反应

Index.d.ts说执行命令应该返回 void,但文档说可以使用它们的返回值

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 任何 可复制演示链接 https://grapesjs.com/docs/modules/Commands.html#stateful-commands 描述一下那个虫子 如何复现这个漏洞? 在Typescript设置中, “''t” 从“grapesjs”导入葡萄; export const ExportPlugin = (editor: grapesjs.编辑) => { 编辑。Commands.add(“render html”, (editor) => { 返回“<html><body>示例</body></html>”; });); };...

artf

谢谢@froodian我会更新他们的

ClaudeCode

谢谢你举报,@froodian。 关于index.d.ts的建议很棒,说执行命令应该返回虚无值,但文档说他们的返回值可能会被使用!虽然这个具体功能还没有出现在核心 API 中,但有几种方法可以实现类似的行为。 使用事件系统: “JavaScript editor.on('component:update', (component) => { 你的逻辑 }); ``` 替代方法: 听取“selector:add”以获取CSS选择器更改 使用“selector:custom”来...

#43842022年6月15日作者 froodian1 个回答
0 个反应

Index.d.ts说组件必须是Backbone.Collection,<Component>但文档上说Component[]也被接受

葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? 任何可复制演示链接 https://grapesjs.com/docs/modules/Components.html#component-definition描述一下那个虫子 如何复现这个漏洞?https://github.com/artf/grapesjs/blob/dev/index.d.ts#L2055 显示组件为“骨干。集合<Component>”https://grapesjs.com/docs/modules/Components.html#component-definition 显示了一系列组件的提供 预期的行为是什么? JS的实现示例...

ClaudeCode

谢谢你举报,@froodian。 关于index.d.ts说组件必须是Backbone.Collection,<Component>但文档说Component[]也被接受。推荐的组件方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('chan...

#43832022年6月14日作者 Singwai2 个回答
1 个反应

在编辑任何文本组件时,插入两个空白时会注入一个“.”字符

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 双击任何文本组件 把光标放在单词之间 插入2个空白 预期行为: 插入2个空白 当前行为: 插入空白字符和“.”字符。 视频示例: https://user-images.githubusercontent.com/5863227/173638822-8a9243d9-d4ab-49d3-8f5f-a9aa4833c35f.mp4行为准则 [X] 我同意遵守本项目的行为准则

Singwai

这是macOS引入的行为,不是Grapesjs的bug。 https://howchoo.com/macos/disable-double-space-bar-period-dot-macos

ClaudeCode

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

#43712022年6月10日作者 clonefunnels4 个回答
3 个反应

所有编辑器在上次更新后都坏了,导致存储管理器坏了。

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://www.teamfunnels.net/login.php 演示演示 描述一下那个虫子 请帮我理解如何修复这次更新导致的所有问题。我不明白为什么不让它和旧方式兼容。但请告诉我,这个例子我需要改动什么: storageManager: { 类型:“远程”, urlStore: 'save.php', urlLoad: 'load.php', storeComponents: true, // 启用/禁用以JSON格式存储组件 storeStyles: true, // 启用/禁用以 JSON 格式存储规则/样式 st...

Vac1911

@clonefunnels我做了一个快速函数,可以加载带有向下兼容的数据: “''t” async function load(editor: grapesjs.编辑) { const { Parser } = editor; const data = 等待编辑器。StorageManager.load({}); 如果 (data.pages) data.pages = [{ ID: '1', frames: [{ component: data.components ??...

Vac1911

@artf 快速补充说明:类型声明中应添加“editor.loadProjectData”

artf

请务必仔细阅读发布说明 https://github.com/artf/grapesjs/releases/tag/v0.19.4 https://github.com/artf/grapesjs/pull/4223#issuecomment-1152331298

#43562022年5月31日作者 Justin83032 个回答
0 个反应

选择器:移除事件不存在

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬101 可复制演示链接 https://jsfiddle.net/sdrf72wx/1/ 描述一下那个虫子 如何复现这个漏洞?在编辑器初始化时执行以下代码添加和移除组件的选择器查看控制台输出 预期的行为是什么? 如果组件选择器被移除,它应该会把选择器打印到控制台。 目前的行为是什么? 如果选择器被移除,控制台不会提示,因此“selector:remove”事件不会触发。 此外,“selector”事件只捕获“selector:add”和“selector:update”,但不捕获“selector:remove”,但在选择器管理器的[event](...

artf

你好@Justin8303“selector:remove”指的是全局选择器的容器,所以只有当选择器实际从全局集合中移除时才触发,而不是从组件中移除。当你从组件中移除选择器时,它依然存在,因为它可能也被用在其他地方。 如果你需要跟踪组件类的变化,我建议使用“component:update:classes”事件

ClaudeCode

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

#43362022年5月19日作者 javadsamiee2 个回答
1 个反应

“导入模板”无法用来移除多余的样式

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 版本 101.0.4951.64 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞?添加段落块打开“导入模板”,添加这些行并按“导入” ' H1, h2, h3, h4, h5, h6{ 字体家族:Arial、Helvetica、无衬线体; 线高:1.5; } p, span, div{ 字体家族:Arial、Helvetica、无衬线体; 线高:1.5; 颜色:红色; }导入的代码正常工作现在打开“导入模板”,移除之前添加的行,然后点击“导入”如果你再次打开“导入模板”,你还能看到那些...

artf

感谢你的报告@javadsamiee但问题实际上是出在预设网页插件 https://github.com/artf/grapesjs/issues/3727#issuecomment-908255324,而不是核心本身。修复的公关是值得的

ClaudeCode

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

浏览所有主题