GrapesJS 问题

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

状态

排序

找到 3,464 个问题

#26982020年4月3日作者 adeguntoro1 个回答

2 个反应

如何使用替换fontawesome url？

我刚接触 Grapejs。第一次用，效果很棒。那么，我怎样才能在不依赖网络的情况下，用自己的电脑用css/js文件替换cdn fontawesome？我住的国家，网络对我来说使用东西非常困难。抱歉我的英语不好。

noogen

@adeguntoro 看看这个：https://github.com/artf/grapesjs/blob/8b315e4ba053043889456fcc4048c4f504257551/src/editor/config/config.js#L152 是通过“cssIcons”属性的“/localpath/css/font-awesome.min.css”来覆盖配置吗？

查看详情

#26972020年4月2日作者 kuhelbeher3 个回答

1 个反应

缺陷

你好！我正在尝试添加自定义组件类型： “JavaScript domc.addType（'image-block'， { 扩展：“单元”，型号：{ 默认值：函数（） { 返回 { 名称：“背景图片”，类型：“图像块”，标签名称：“TD”，虚无：虚假，可掉落：确实如此 } } }, isComponent （el） { if （el.tagName === 'TD' & el.classList.contains（'bg-image'））） { return { 类型：“image-block” } } } }) 但当我把这个方块放到画布上时，<td>标签在画布和DOM上都不显示。如果我从组件定义中移除 isCompon...

artf

@kuhelbeher你的代码是正确的（除了是“extend： 'cell''，而不是”extends： 'cell'“），不幸的是，行组件上应用了一个[bug]（https://github.com/artf/grapesjs/blob/af602c30743b54288088d965c3805c0b6e0dac40/src/dom_components/model/ComponentTableRow.js#L19）（或错误逻辑），所以目前我建议先添加这个作为补丁： “'...

noogen

@kuhelbeher因为你的组件根据你上面的内容定义是“table”，而不是你 addType 定义的 'td'（tagName' 属性）吗？

kuhelbeher

@noogen 我觉得问题不在这上面。我尝试这样定义组件和模块： “JavaScript domc.addType（'custom-cell'， { 扩展：“细胞”，型号：{ 默认值：{ 可移除：错误，名称：“自定义单元”，类型：“自定义单元”，可复制：错误，标签名：“TD” } } }) bm.add（'root'， { 标签：“页面包装机”，类别：opt.类别，内容： <表宽度=“400px”> <tbody> <tr> <td data-gjs-type...

查看详情

#26962020年4月2日作者 kuhelbeher2 个回答

10 个反应

：我如何创建带有内置“图像”行为的背景图像块？

你好，我正在尝试创建带有背景图像的方块（类似于Grapedrop Image Box）。我添加了这样的新组件： “JavaScript domc.addType（'image-block'， { 扩展：“图像”，型号：{ 默认值：function（） { 返回 { 名称：“背景图片”，类型：“图像块”，标签名称：“div”，虚无：虚假， Droppable：确实如此，可调节大小：真 } } }, 浏览量：{ 标签名称：“div”， updateSrc： function（） { const { model， em } = this; const srcResult = model.getSrcResult（）; cons...

kuhelbeher

@noogen 谢谢你的建议，我是这样实现的： “JavaScript const domc = 编辑。主成分 domc.addType（'image-block'， { 扩展：“默认”，型号：{ 默认值：函数（） { 返回 { 名称：“背景图片”，类型：“图像块”，标签名称：“div”，虚无：虚假，可掉落：确实如此 } } }, 浏览量：{ 初始化（） { this.listenTo（this.model， 'active'， this.onActive） t...

noogen

@kuhelbeher因为，归根结底，它仍是一个形象。它不是用来按你想要的方式使用或覆盖的，因为在后端代码（查看图像组件模型和视图）中，https://github.com/artf/grapesjs/blob/dev/src/domcomponents/view/ComponentImageView.js#L55 和 https://github.com/artf/grapesjs/blob/dev/src/domcomponents/model/ComponentIm...

查看详情

#26932020年4月1日作者 mazuschlag3 个回答

1 个反应

富文本编辑器的位置在进入/返回时不会更新

再次感谢大家为这个项目付出的所有努力！这在当前版本0.16.3中可以复现——你可以在通讯演示版中查看：https://grapesjs.com/demo-newsletter-editor.html 通常RTE会出现在元素上方，因此这不是问题。然而，当启用RTE的元素靠近编辑器顶部时，RTE在元素上方没有空间，因此RTE会被放在下方。按下“回车”或“回车”时，RTE会保持原位，阻挡了下面大部分元素。要重现：开放 GrapesJS在编辑器顶部放置文本字段输入文字并按下回车键。当用户通过退格键删除文本元素中的一行时，RTE的位置会正确更新，并移动到元素的新边。但对于回车键，RTE完全不移动。

khurram900

@mazuschlag如果你用的是 CKeditor，可以试试这个补丁。它会重新计算并将 ckeditor 重新定位到正确的位置。 'CKEDITOR.on（'instanceReady'，函数（e） {' '编辑。RichTextEditor.updatePosition（）;' });

artf

Canvas 工具应该在文本组件的“输入”事件时更新，当前版本甚至内置 RTE 也有问题，但下次版本会修复。不知怎么的，这个问题不会影响CKEditor插件，但据我所见，“enter”从未触发“input”事件，所以我觉得CKEditor实例应该附加了其他事件。我很乐意收到关于这个插件的永久认证

mazuschlag

@artf 谢谢你的回复，但我有点困惑。CKEditor插件也会出现这种情况——你的意思是修复会和内置的CKEditor修复分开？我不介意修复，但你有什么建议从哪里开始吗？

查看详情

#26922020年4月1日作者 mazuschlag3 个回答

0 个反应

需要帮助

快速点击鼠标或移动可能会导致编辑器卡死

首先感谢你为这个项目所做的所有努力！这是一个非常棒的项目，很多人都依赖它，感谢你的努力。这个设定有点奇怪，但基本意思是，点击元素时快速移动鼠标可能会导致建造器卡住。这不总是大问题，但快速工作时会让人烦躁。你可以在GrapesJS网站的演示页面重现这个问题。要重现：打开GrapesJS并添加各种内容点击并快速移动鼠标到元素上。它不一定每次都能复制，但一旦复制，整个建造者就会冻结。随着编辑器中内容的增加，这种情况可能会变得更糟/更容易复现。

artf

你好，@mazuschlag，感谢你的好评。关于这个问题，你能详细说明一下“点击和移动”的行为吗？我是不是应该只选一个组件，只在鼠标上移动？之前有个问题是移动组件会导致应用冻结（基本上可以把组件丢进自己的子组件里，导致无限循环），但几个版本前修复了。

mazuschlag

嗯，这听起来确实有点像我遇到的问题。这需要按住鼠标左键，快速拖动组件后再松开。这种情况发生在快速操作时——你点击一个组件，当你把鼠标移开（同时还在向下点击一会儿）时，编辑器会“卡住”。你可以通过再次点击组件并拖动它来解冻。

artf

@mazuschlag，你用的是旧版还是最新的Grapesjs？我无法在最新版本中复现它

查看详情

#26912020年3月31日作者 sathyanarayananaCES3 个回答

8 个反应

在从 Code Editor 保存代码时丢失组件信息

我已经在网页构建器中集成了代码编辑选项。使用 'editor.getHtml（）' 获取当前 HTML 内容并在代码编辑器中填充在从代码编辑器保存代码时，我使用 'editor.setComponents（）' 将编辑内容设置为构建画布。问题从代码编辑器保存html后，它会丢失所有旧组件相关信息，并作为一个新组件，特征中保留默认值。'data-gjs-type' 变成默认，无法识别自定义组件。分析与思考查了一下，好像是，当我们使用 'editor.getHtml（）' 时，它会得到没有任何 'data-gjs-*' 属性的最终 html。'editor.setComponents（）' 方法似乎覆盖了旧的组件信息。问题为了...

pouyamiralayi

@jenter [#1331评论]（https://github.com/artf/grapesjs/issues/1331#issuecomment-409537048）和[#2644评论]（https://github.com/artf/grapesjs/issues/2644#issuecomment-598666594）是很好的例子。另外可以看看[#2664评论]（https://github.com/artf/grapesjs/issues/2664#issuec...

noogen

@sathyanarayananaCES 首先，呼应其他人的观点，最好用get/setComponents和get/setStyle来保存编辑器的内容。如果我理解没错，你是想用 HTML 作为htmlCodeEditor，并且用户编辑后可以导入回editor。看看编辑器导入的演示，它只需用原始 HTML 调用 setComponents。参考文献 - https://github.com/artf/grapesjs/blob/dev/docs/api/editor.md#e...

pouyamiralayi

你好@sathyanarayananaCES必须调用“editor.getComponents”和“editor.getStyle”才能获取组件详情;然后你可以通过调用“editor.setComponents”和“editor.setStyle”返回存储状态，使用上述函数调用的结果。干杯！

查看详情

#26902020年3月31日作者 adamwpe3 个回答

12 个反应

自定义组件在保存时消失（Vue.js）

大家好，我正在尝试在块管理器中添加一些自定义Vue.js组件，乍一看一切正常——渲染正常，Vue组件响应良好。但如果我保存模板，重新加载页面，并向storageManager提供“gjs-style”、“gjs-components”、“gjs-html”、“gjs-css”，自定义组件不再渲染。看起来storageManager会移除所有脚本标签????就像我检查了我的REST GET请求一样，'gjs-html'确实包含<script>了这个标签。保存前： ![之前]（https://user-images.githubusercontent.com/49768920/77969331-640cf400-72e1-11...

adamwpe

@pouyamiralayi 谢谢你的建议，帮我指明了方向——他是我用来解析 Vue 组件并且能在 :) 后重新加载的例子，但对其他人可能也有帮助：谢谢大家的帮助！

mcottret

你好@adamwpe！脚本标签导入被[默认编辑器配置]（https://github.com/artf/grapesjs/blob/master/src/editor/config/config.js#L86）禁用，这也解释了为什么[你的脚本标签被HTML解析器剔除]（https://github.com/artf/grapesjs/blob/dev/src/parser/model/ParserHtml.js#L277），将“allowScripts”编辑器配置选项设置...

pouyamiralayi

@adamwpe我们以前也有类似的 https://github.com/artf/grapesjs/issues/2359#issuecomment-548134223，抱歉没能坚持到底！这样做：在最新版本中，无需从dView和dModel扩展。关于 Vue JS 集成，请注意 GrapesJS 不会检测到 Vue 组件的内部结构，因为没有生成模型！如果你有机会克服这种情况，请告诉我们！干杯！

查看详情

#26882020年3月27日作者 peterlinus1 个回答

1 个反应

有哪些编程语言/框架/库/插件？

我对这个项目非常感兴趣，但请大家给我一些指导。有没有关于这个项目中使用的编程语言、框架、库、插件等的文档？有没有文档解释每个文件夹包含什么内容？如果能提供如何开始进一步发展这个项目的指导，我将非常感激。为了继续编写这个项目，我需要学习哪些内容？谢谢。

GoodPHP

你好，想要添加编辑器的更改，需要懂Javascript，或者想找懂的人。医生：https://grapesjs.com/docs/ 你想要的那样的描述，都不会。文档描述了主要方法。例如，你可以查看我们为GrapesJS设计的：https://github.com/GoodPHP/GrapesJS-devfuture

查看详情

#26872020年3月27日作者 christianbalderrama3 个回答

0 个反应

如何将样式管理器附加到自定义面板

我想把整个风格管理器模块附加到面板上？过去两天我一直在翻找文档，但没找到合适的例子。我已经将GrapeJS编辑器面板初始化为空数组，以移除所有面板，并设置了示例中提供的自定义面板目前看起来是这样的： ![图片]（https://user-images.githubusercontent.com/18398769/77723611-ef5d5f80-702b-11ea-971e-cb13d5b084c7.png）我想让样式管理器移动到右侧自定义面板下方。谢谢！

christianbalderrama

有没有我不知道的 grapesjs 正确方法，还是必须通过 CSS 覆盖

christianbalderrama

“''CSS .panel-top { 缓冲：0; 宽度：100%; 显示：flex; 位置：首字母; 正义内容：中心; 正当化内容：空间之间的; } .panel-top-actions { 位置：首字母; }

pouyamiralayi

你好@christianbalderrama 在你的初始化配置里：对于扇区，[这里]（https://github.com/artf/grapesjs/blob/53cfe888a0ee5d49c43cd4e3fa5daf0b55f8277c/demo.html#L1101-L1108）是演示中使用的扇区。干杯！

查看详情

#26862020年3月25日作者 JonyBlade3 个回答

13 个反应

雇佣GrapesJS开发者

我为GrapesJS开发者交换联系人制造了一个问题。我认为这对大多数人来说非常有用。 @artf，如果你喜欢我的主意，请把这枝插上去。更新：如果你愿意被录用，请在这里回复，留下所有必要信息。直接联系开发者，不要在这里回复。

GoodPHP

@JonyBlade，好主意 😎 DevFuture是全球首个热衷于GrapesJS开发的机构。我们拥有超过4年的经验，99+个重点项目和50+个令人满意的客户。更多详情请见：https://devfuture.pro/grapesjs-development/ GJS.market：https://gjs.market/authors/devfuture-development 电报：https://t.me/grapesjs 联系人：电子邮件：support@de...

jacob5544

删除那些因为系统漏洞而急需帮助的评论，真的很令人难过。阿图尔·阿尔谢涅夫，真丢人——你性格很糟糕！

artf

@JonyBlade好吧，为什么不呢

查看详情

GrapesJS 问题

如何使用替换fontawesome url？

自定义组件类型和表单元的问题

：我如何创建带有内置“图像”行为的背景图像块？

富文本编辑器的位置在进入/返回时不会更新

快速点击鼠标或移动可能会导致编辑器卡死

在从 Code Editor 保存代码时丢失组件信息

自定义组件在保存时消失（Vue.js）

有哪些编程语言/框架/库/插件？

如何将样式管理器附加到自定义面板

雇佣GrapesJS开发者

浏览所有主题