GrapesJS 问题

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

找到 3,464 个问题

#29592020年8月16日作者 papyr1 个回答
0 个反应

专长:扩展设置

你好,这真的是一个非常非常好的工具 你能在设置里分享一些见解吗?我可以帮忙添加更多,这样大家都能把这些内容整合进维基。如何扩展“设置”,允许用户选择/切换/更改图类型,例如“条形图”允许用户在拖拽到页面后,从下拉菜单中的预定义列表中为table_pick数据源。允许用户勾选框,自动生成ID。例如,我想在'div ID'前加上'BudgetPage2-'AutoIncrementedNumbers_ ![图片](https://user-images.githubusercontent.com/12733414/90340424-165e0300-dfc6-11ea-9387-9562d5b172ab.png)

artf

你得扩展“工具栏”属性 https://grapesjs.com/docs/api/component.html#properties

#29582020年8月13日作者 rudym872 个回答
0 个反应

BUG:编辑。Panels.removeButton('options', 'preview') 破坏查看代码

版本: 0.16.18 你能重现演示中的bug吗? 不 预期的行为是什么? 我想隐藏默认的预览按钮,同时保留默认的“查看代码”按钮。 目前的行为是什么? 如果通过以下方式移除预览按钮,“查看代码”将不再有效。 “''javascript 编辑。Panels.removeButton('options', 'preview') ```` 你能附上截图、截屏或实时演示吗? 是的:[JS Fiddle](https://jsfiddle.net/m810gtcn/)

mcottret

你好@rudym87! 问题似乎是由[关闭执行命令的按钮](https://github.com/artf/grapesjs/blob/dev/src/commands/view/ExportTemplate.js#L6)(见下文)引起的,这会导致模态瞬间关闭。 https://github.com/artf/grapesjs/blob/a85126883fbeafe3a437b1421b952931a5aaafc0/src/commands/view/ExportTemp...

artf

没错,@mcottret说实话,我现在甚至看不出还有什么理由让这个[命令有状态](https://grapesjs.com/docs/modules/Commands.html#stateful-commands)。 所以,我会去掉那个没用的“sender.set('active', 0)”和“stop”函数。如果你有更好的建议,告诉我

#29572020年8月13日作者 jayeshmotwani1 个回答
0 个反应

BUG:无法为<table>自定义方块添加标签

你好,我正在尝试创建一个自定义的倒计时计时块。代码如下: 我正在“table”标签内添加内容。我一拖放方块就出现错误——Uncaught TypeError: t.get 不是函数。请参考下面的截图: ![图片](https://user-images.githubusercontent.com/27188013/90142685-4c1ea400-dd9a-11ea-9c36-52b57cd2c642.png) 但是,如果我在编辑器里做了任何修改,它又能正常工作了。视频链接:https://drive.google.com/file/d/1CNoXJihVnqj_3wzQybT6k0JqVCH7ESx2/view 谢谢你的帮助。

artf

如你所见,错误是从“grapesjs-plugin-social”触发的,所以与核心无关。 我唯一能建议的是,在表格里使用'tbody'标签

#29562020年8月13日作者 dat150219992 个回答
2 个反应

为组件添加事件并获取 getJs

你好,artf, 我对这款葡萄是新手。 如何为组件添加事件并获得相应的JavaScript或jQuery? 谢谢大家

RJCAM

你好@dat15021999 GrapesJS 不支持JavaScript代码,只支持html和css。 不过,你可以通过运行 'editor.getJs()' 函数来获取所有 js 代码。

Ju99ernaut

你可以用类似这样的工具: “''js const target = editor.getSelected(); const code = target.get('script') ||''; 一些用于查看和编辑代码的逻辑 targer.set(“脚本”,代码); 你可以看看 [grapesjs-script-editor](https://github.com/Ju99ernaut/grapesjs-script-editor)和 [grapesjs-blockly](ht...

#29552020年8月12日作者 jamejillagit2 个回答
1 个反应

块管理器中缺少图标

你好, 我开始用 Grapesjs,但不知为何,Block Manager 里的一些图标不见了。 ![图片](https://user-images.githubusercontent.com/64067337/90017538-f966be80-dcab-11ea-9cc6-e8137c55ac25.png) 我看到显示的图标用的是font awesome,而未显示的图标则有“gjs-fonts”类,比如“gjs-f-b1”。 查看CSS时,我能找到以下样式: 为什么我看不到任何图标?我应该手动添加图标,还是需要做什么?不确定是否相关,但我还会遇到一个字体缺失的错误,不知道它从哪里来的。找不到的路径是 project/path/...

EmilIpsen

以防有人看到这个,最后没找到答案: 我也遇到过这个问题,下载了unpkg的原始CSS+JS文件——同样的文件在CDN运行时正常,但指向本地时也出现同样错误。 我通过浏览unpkg文件夹(https://unpkg.com/browse/[email protected]/dist/)解决了这个问题——grapes.js文件在根目录里,有两个文件夹,分别叫“css”和“fonts”。图标加载不出来的问题很可能是因为字体文件没下载,CSS指向不正确(因为CSS文件中的路径是相对路...

sailor95

你好@jamejillagit,你找到解决办法了吗?我也遇到过同样的情况。

#29542020年8月12日作者 ghost1 个回答
0 个反应

BUG:用Jest测试时无法运行预览模式

版本: 0.15.10 嗨! 我用 Jest 来测试我的Grapes.js组件。我需要在编辑器中的编辑模式和预览模式中测试组件的行为Grapes.js。在编辑模式下测试时一切正常,但当我需要在预览模式下测试时,我尝试运行脚本 'editor.runCommand('preview')',结果出现错误。测试在node.js中运行正常,但我成功在谷歌开发者面板中调试了它,这样我们可以从内部操作代码。 ![图片](https://user-images.githubusercontent.com/48758473/90000831-51e09080-dc99-11ea-9a97-225c10fa6d74.png) 如果出现错误,我们理解...

ghost

我忘了在当前文档中添加编辑器包裹元素,所以我初始化的编辑器在DOM中不存在 12行的解法: <img width=“488” alt=“solution” src=“https://user-images.githubusercontent.com/48758473/90397413-77f2a000-e0a0-11ea-9f99-c8d43fef06c8.png”>

#29532020年8月11日作者 cartifon2 个回答
0 个反应

BUG:在选择某项内容后,从Grapes导航出去时出现错误。

嗨,@artf, 步骤: 用GrapesJS打开Canvas,选择任一组件,然后点击“Go to Random”,我会收到“无法读取未定义属性'models'”的错误。 只有当我在切换到其他页面前调用了“editor.destroy()”时才会发生这种情况。但如果我移除毁灭,它就没问题...... 演示:https://stackblitz.com/edit/grapesjs-models 我真的应该叫'destroy()'吗?如果我不破坏GrapesJS,多次打开GrapesJS会有问题吗?

artf

谢谢@cartifon应该会在下一个版本中修复

Nelida27

你好, 我现在换到最新版本后也有同样的问题。 我应该叫 editor.destroy()?

#29522020年8月11日作者 krishnaeverestengineering3 个回答
0 个反应

保存后自定义组件无法使用。

你好, 我创建了Button-Link自定义组件,第一次拖入Canvas时,组件检测到它的属性和样式。但保存组件并重新加载页面后,该组件中缺少自定义组件类型,取而代之的是链接类型组件。如何在保存后保留自定义组件?

DmitryTar1

你应该给组件添加一个类型,然后在 isComponent 里解析它 比如类似按钮链接 const components = 编辑器。主导组件; const link = components.getType('link'); components.addType('custom-link-button', { 模型:link.model.extend({ defaults: Object.assign({}, link.model.prototype.defaults, {...

Ju99ernaut

@krishnaeverestengineering 你是如何保存和加载你的作品的

artf

请阅读相关文档 https://grapesjs.com/docs/modules/Storage.html

#29512020年8月11日作者 tasham163 个回答
1 个反应

排版扇区未找到

在尝试向样式管理器添加字体时,我使用以下代码: 'const prop = 剪辑师。StyleManager.getProperty(“排版”,“字体家族”); prop.set('options', [ {value:“'Oswald',衬线”,名称:“Oswald'}, ... ]);` 不过,当我在插件(index.js里)用它时,我用editor.on('load',....)来调用它。我一直看到“排版”扇区找不到。但是如果我在插件之外(index.html里)调用它,也就是用所有配置初始化编辑器,它就能正常工作。所以我在想,我们能不能在插件里添加新的前线,让它们自动被打包到那个插件里?如果没有,为什么?如果可能的话,请告...

mcottret

嗨@tasham16! 我认为这是预期的行为,因为[模块加载](https://github.com/artf/grapesjs/blob/dev/src/editor/model/Editor.js#L146)是在[编辑器初始化序列](https://github.com/artf/grapesjs/blob/dev/src/index.js#L77)插件之后,且[扇区只在“StyleManager”模块加载后立即添加](https://github.com/artf/g...

tasham16

非常感谢!我会试试这个方法!

artf

正确的做法是等待编辑器加载 “''js editor.on('load' => { const prop = 编辑器。风格经理...... }) ```

#29502020年8月10日作者 sircoko3 个回答
1 个反应

编辑面板样式(新手问题)

大家好,我想请教一下应该添加或编辑哪些代码,以便更改面板的外观。 一般来说,我需要更改所有UI样式,但我想先从块、图层和样式管理器开始。 我希望能够调整布局、颜色等,使其更符合我的品牌形象。 我试着在问题和文档里看。但听到这些名字,我感到有些迷茫。 有人能帮我走这段路吗? 提前感谢大家

Joshmamroud

> @sircoko 你能举一些代码示例,并更详细地解释你困惑的地方吗?嗯,不是代码,但我可以用图片更好地解释我的需求......简单来说,我想从这里开始:https://imgur.com/a/3UseHB6类似这样的内容:https://imgur.com/Z2B4DR4如你所见,面板上的元素被以不同的布局、不同的样式排列。这就是我需要改变的 @sircoko 要用这种方式设计,我相信你需要用自己的CSS覆盖默认的GJS样式。 请参阅[主题指南](https://gra...

Joshmamroud

@sircoko 你能举一些代码示例,并详细解释你困惑的地方吗?

sircoko

@sircoko 你能举一些代码示例,并更详细地解释你困惑的地方吗? 嗯,不是代码,但我可以用图片更好地解释我的需求...... 简单来说,我想从这里开始:https://imgur.com/a/3UseHB6 对类似这样的内容:https://imgur.com/Z2B4DR4 如你所见,面板上的元素被以不同的布局、不同的样式排列。 这就是我需要改变的

浏览所有主题