GrapesJS 问题

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

找到 231 个问题

🔍 general
#38602021年10月12日作者 sduncan-tribe2 个回答
1 个反应

从0.16.27升级到0.17.27后,块无法工作

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Firefox 93.0,Chrome 94.0.4606.71 可复制演示链接 https://github.com/Tribe-Mobile/grapesjs-blocks 描述一下那个虫子 如何复现这个漏洞?运行git仓库,不显示任何块切换到版本 0.16.27 nd 运行 预期的行为是什么? 展示方块 目前的行为是什么? 没有显示方块 行为准则 [X] 我同意遵守本项目的行为准则

paooolino

见这里 #3835

ClaudeCode

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

#37352021年8月30日作者 codingmachine164 个回答
3 个反应

选择选项没有显示。 而是作为输入显示

你好,@artf, 我们用“选择选项”作为特质,但这些选项显示为输入。有时显示选项,有时显示为输入。我们的代码如下 defaults: Object.assign({}, defaultModel.prototype.defaults, { 特质:[ { 标签:“类别”, 名称:“noOfCategories”, id:“noOfCategories”, 类型:“选择”, 选项:[ { 编号:“0”, 名称:“无”, }, { 编号:“1”, 名称:“1”, }, { 编号:“2”, 名称:“2”, }, { 编号:“3”, 名称:“3”, }, { 编号:“4”, 名称:“4”, }, { 编号:“5”, 名称:“5”, },...

YumiChen

@artf 补充一下,这两天我们也碰到了这个。这似乎只发生在“0.17.25”版本。以下是Jsfidle的转载,如有需要请查看: https://jsfiddle.net/a29h7twy/5/ 繁殖步骤:将组件拖入画布选择组件并点击设置按钮检查特征选择性状作为输入显示。在开发工具控制台中会显示一些警告

codingmachine16

你好@artf 这个问题依然存在。这什么时候能解决? [特质]: 'select'类型未找到 {level: 'warning'}

codingmachine16

好的。当然。谢谢。供参考,这个问题在2022年0.17.000不存在

#37322021年8月27日作者 aliibrahim1234 个回答
0 个反应

注释组件类型不支持添加特征

我正在开发一个脚本,可以在所有组件类型上添加一个特征,但注释类型没有原型对象。 代码 “''js ddw = 编辑。DomComponents.getTypes(); 对于(设i = 0;i <ddw.length;i++) { DDQ = ddw[i].id; 编辑。DomComponents.addType(ddq, { 模特:剪辑师。DomComponents.getType(ddq).model.extend({ defaults: Object.assign({}, editor.DomComponents.getType(ddq).model.prototype.defaults, { 特质:编辑。DomCompone...

aliibrahim123

@artf

artf

不要用“model.extend”/“view.extend”,那是旧API的一部分。 这就是如何正确扩展所有成分性状的一个例子 “''js const { Components } = 编辑器; Components.getTypes().forEach(({ id, model }) => { Components.addType(id, { 型号:{ 默认值:{ 特质:[ ...model.getDefaults().traits, 'new-trait', ] },...

skru

这是个很棒的解决方案,有没有什么建议可以针对函数中定义特征的组件?根据文档:https://grapesjs.com/docs/modules/Traits.html#add-traits-to-components

#37262021年8月26日作者 ryprfpryr4 个回答
0 个反应

如何添加扩展 [帮助]

请问,有人能用清晰的步骤解释如何添加扩展吗? 非常感谢!

artf

我想你就是在找这个 https://grapesjs.com/docs/modules/Plugins.html

ryprfpryr

我想你在找这个 https://grapesjs.com/docs/modules/Plugins.html 嘿,@artf谢谢你的回复,但我真正需要知道的是如何给我的Grapesjs添加现有的扩展/插件。 我的主要目标是托管一个使用 demo 页面相同模块/扩展的 Grapsjs 实例。

artf

嘿,@ryprfpryr你可以在这里查看演示文件 https://github.com/artf/grapesjs/blob/gh-pages/demo.html

#37222021年8月25日作者 amansharmaagami2 个回答
0 个反应

想添加固定大小的画布高度

我用它来制作动态PDF内容。 我想固定画布的高度,这样用户就不能从给定大小(高度)添加更多方块。 我想要删除滚动和一个消息或限制,比如不能添加更多物品之类的。 在同一个地方找到了一个旧问题 https://github.com/artf/grapesjs/issues/1803 如果更新成本高,请建议我如何实现同样的效果。

amansharmaagami

@artf 感谢你制作GrapesJS。

ClaudeCode

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

#37212021年8月23日作者 christosapos4 个回答
2 个反应

用Cypress测试拖拽

你好,@artf。我想用Cypress工具在GrapesJs上运行一些测试场景。但我无法用Cypress模拟拖拽模式。你能帮帮我吗? 谢谢。

ronaldohoch

我觉得这对你有帮助: https://stackoverflow.com/questions/55361499/how-to-implement-drag-and-drop-in-cypress-test

christosapos

我也尝试过类似的方法,但对我没用......我觉得我的问题是,grapesJ的画布被渲染成iframe,带有块的表格渲染在这个iframe之外,而Cypress当我点击一个块拖动并放入iframe时,却无法处理iframe内部的内容。如果你成功了,告诉我。

ronaldohoch

我开发阶段还没到测试阶段 :/ 但我假装用Cypress。

#37182021年8月21日作者 Abhisheknanda13444632 个回答
0 个反应

覆盖阻力函数

你好@artf我想覆盖“dmode ”absolute“' 的拖拽功能。 目前我们可以自由移动画布,如果在桌面上移动,其他移动端和桌面设备就不一样了。另外,我希望像素数是百分比,这样在整个屏幕上都能响应。 请问你能帮我从哪里开始,以及如何实现吗? 谢谢

artf

你必须[扩展](https://grapesjs.com/docs/modules/Commands.html#extending)[ComponentDrag](https://github.com/artf/grapesjs/blob/dev/src/commands/view/ComponentDrag.js)命令

ClaudeCode

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

#37152021年8月20日作者 mingxin-yang3 个回答
0 个反应

如何添加点击事件

这是我自定义的区块代码: 我想在把按钮添加到画布后添加点击事件,点击后就能看到mj文本中的内容

mingxin-yang

@artf

artf

@mingxin-yang 你必须 [扩展](https://grapesjs.com/docs/modules/Components.html#update-component-type) “mj-button” 组件的 [view](https://grapesjs.com/docs/modules/Components.html#view)

ClaudeCode

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

#37122021年8月17日作者 aliibrahim1232 个回答
0 个反应

帮助:如何判断区块管理器面板是否打开

当块管理器打开时,任何人都知道如何执行某个函数

artf

如果你用默认命令显示/隐藏方块,可以通过“编辑器”来实现。Commands.isActive('open-blocks')'

ClaudeCode

谢谢你举报,@aliibrahim123。 关于帮助:如何判断区块管理器面板是否打开,这个问题很棒。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('somet...

#37102021年8月17日作者 rajnishrao2 个回答
0 个反应

TypeError:无法读取未定义属性“stop”的

我在一个React项目中使用GrepeJS。 当我进入预览模式并按下浏览器返回按钮时,预览模式不会退出。但是,当我点击眼球时,它会报错“TypeError: Cannot read property 'stop' of undefined ” ![葡萄JS-错误](https://user-images.githubusercontent.com/3764449/129687645-4b8cd75f-1d31-465e-aad0-8cc730d770c8.png)

artf

你好@rajnishrao请尝试更新到最新版本。如果你仍然遇到这个问题,可以新开一期并附上可复现的演示。

ClaudeCode

谢谢你举报,@rajnishrao。 错误 TypeError: 无法读取未定义的属性'stop'” 发生在模块尝试访问属性时,尚未完全初始化组件生命周期。这是GrapesJS中常见的竞争条件。 立即解决办法: 如果你控制代码,可以用空检查包裹调用: “JavaScript if (component && typeof component.method === 'function') { 你的准则 } ``` 根本原因分析: 模块在调用你的方法之前不会验证状态。当多个操作...

浏览所有主题