PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。 获取抢先体验

GrapesJS 问题

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

找到 3,464 个问题

#30092020年9月8日作者 BillTheGoat3 个回答
3 个反应

BUG：限制包裹组件的掉落

版本： 0.16.22 你能重现演示中的bug吗？ [ ] 是的 [X] 不——需要编辑js。 预期的行为是什么？ 一旦将“droppable”属性设置为“false”，包装组件就不应是“droppable”。 目前的行为如何？' 设置这个属性时没有任何反应。 详细描述那个漏洞 子组件可以通过 'data-gjs-droppable=“.foo”' 或 'data-gjs-droppable=“false”来限制， 但当该属性在包装组件上使用 'DomComponent' API 时则无效。我尝试过在“init”里用“domComponents”添加它们，直接在init之后添加，或者等待编辑器“加载”。我已经尝试使用“droppa...

RJCAM

你好@BillTheGoat init后试试这个：

RJCAM

我觉得是因为包装不构成DomComponents的一部分。 主成分仅指包裹内部的组件。：微笑：

BillTheGoat

嗯。我尝试过这个，因为API文档中第一个函数是[DomComponents.getWrapper（）]（https://grapesjs.com/docs/api/components.html#getwrapper），而且它确实应用了属性，正如我上面沙盒中所见。这让我觉得奇怪的是，editor.getWrapper（） 函数似乎只是源 ;) 中 editor.get（“DomComponents”）.getWrapper（） 的封装器。 编辑：实际上 wrapper 在...

查看详情
#30082020年9月7日作者 trony20203 个回答
0 个反应

中心A师和可调整大小的边界

1）如何在图层管理器中将div置中？ 我必须用哪个按钮？ 2）如何让方块的可调整大小边界看起来？ 谢谢！

artf

如何在图层管理器中将 div 置中？ 你什么意思？？哪个师？如何让方块的可调整大小边框显现出来？ 是块块还是组件？

trony2020

你好，你什么意思？？哪个师？ 在一个区块里，我们有许多 div 嵌套或不嵌套，选择一个 div 并按某个按钮将其置中到 father div 中方块还是组件？ 区块

artf

请先阅读文档 https://grapesjs.com/docs 避免混淆块/层等术语，因为从我的角度看，我读的内容毫无意义

查看详情
#30072020年9月7日作者 KishanRavindran1 个回答
1 个反应

BUG：我无法在表单外拖放组件，但会收到警告。

警告 版本： 0.16.22 你能重现演示中的bug吗？ [1] 是的 [ ] 不 无法拖拽输入框或文本框，也无法从表单块中选择 每当我拖拽输入组件时，我都会得到以下结果 ![图片]（https://user-images.githubusercontent.com/22557988/92380658-3301dc80-f127-11ea-98b8-925c7d16b2e4.png） 当我尝试拖拽输入或任何组件（除了表单）时，拖放功能都不起作用，我在 grapesjs 演示链接里检查了同样的情况，我能重新激活它。有人能给我指点一下吗？ https://grapesjs.com/demo.html 你能附上截图、截屏或实时演示吗？...

RJCAM

你好@KishanRavindran这不是bug，而是编辑器的默认行为。 查看本期#2812和#2180以获取更多信息。

查看详情
#30062020年9月7日作者 ashercoren1 个回答
0 个反应

BUG：不要用 for in 循环对对象进行循环

版本：0.16.22 你能重现演示中的bug吗？ [-]是的 [ ] 不 预期的行为是什么？ 对对象进行循环处理应使用“Object.keys.forEach...”，而不是用for-in循环。 通过 for in 循环循环对象，会包含通过原型链继承的属性。这种行为可能导致你的for循环出现意想不到的项目。 更多详情可见[这里]（https://2ality.com/2012/01/objects-as-maps.html）。 你能附上截图、截屏或实时演示吗？ [ ] 是的（附上） [-]不

ashercoren

这导致了我们的应用程序出现bug，因为我们使用的是一个向对象原型添加属性的包。 当我们尝试初始化grapes.js编辑器时，控制台会出现错误。 ![图片]（https://user-images.githubusercontent.com/4491308/92356054-2614c700-f0ee-11ea-8fbb-8eb9459ed321.png）

查看详情
#30052020年9月7日作者 Davidvlv3 个回答
1 个反应

BUG：图层管理器 appendTo 每次 grapesjs 初始化时都会复制图层

版本： 0.16.18及以上（问题是在0.15.3之后出现的，具体时间不确定） 你能重现演示中的bug吗？ [x] 是的 [ ] 不 预期的行为是什么？ 在 grapesjs.init（） 时，图层管理器带 appendTo 应该用新的图层替换。 目前的行为是什么？ 当图层管理器中调用 grapesjs.init（） 并带 appendTo 时，每次都会创建一个新的图层管理器，从而使旧的成为孤儿。 你能附上截图、截屏或实时演示吗？ [x] 是的 https://jsfiddle.net/uevznyLk/ [ ] 不 要重现：多次按“添加 Grapesjs”按钮。

artf

嗯，说实话我之前不明白这是怎么做到的，但我会在下一个版本里修正的

RJCAM

你好，@Davidvlv你把图层附加在“gjs”的div元素之外，这样你可以看到当你移除Grapesjs编辑器（用移除按钮）时，图层面板会保持不动，因为你这样做是把编辑器和图层分开的。 你可以在点击“移除”按钮后清空div“图层，这样可以修复删除功能。 另外，如果你不想图层面板重复，我觉得你需要在添加功能之前调用移除函数。

Davidvlv

谢谢@RJCAM，我能看到怎么修补。问题是，在我从0.15.3升级到0.16.18之前，这种情况并不存在——它以前在重新初始化时可以正常处理appendTo。所以我仍然认为这是某个时候引入的bug，应该被修复。

查看详情
#30042020年9月5日作者 Bakino2 个回答
0 个反应

问题：自定义风格属性以更改类

你好， 感谢这位优秀的编辑。 在我的项目中，我想用样式管理器调整组件类别。比如，我用的是 bootstrap，我希望用户能从投递框应用像 bg-danger、bg-primary 这样的类，而不是手动输入类名。 我知道我可以用特性来实现（而且效果不错），但样式控制放在样式管理器部分更一致（而且在特征部分放选项太多了）。 我看到可以在样式管理器中添加自定义类型，但总是更新一个CSS属性。是否可以用这些自定义类型来更新组件的类属性？

artf

有一个选项可以让你指定要选择的目标（职业或组件特定风格） https://github.com/artf/grapesjs/pull/2474（在你的情况下，“componentFirst”应该被禁用） 遗憾的是，选择器管理器的界面本身不容易自定义，但我认为你应该可以依靠[事件和API]（https://grapesjs.com/docs/api/editor.html）从零开始创建一个。

Bakino

谢谢你的回复:)

查看详情
#30022020年9月4日作者 jcamejo2 个回答
0 个反应

BUG：如果初始化时样式管理器面板未激活，CSS 属性不会正确加载

嗨，@artf！ 让我来描述一下问题 版本： 16.22 预期的行为是什么？ CSS 属性值和可见性设置应采用正确的配置 详细描述那个漏洞 如果在编辑器加载时样式管理器未激活，点击元素并打开样式属性时，它们不会被更新。 繁衍步骤 1 - 让样式管理器面板视图默认不激活 2 - 使组件中的任何 css 属性不可样式化，在此示例中，文本组件 css 的“display”属性不可样式化 3 - 当你点击并打开组件的样式视图时，显示属性依然存在 <img width=“1305” alt=“image” src=“https://user-images.githubusercontent.com/1976679/92250339-a4dd...

artf

我猜我们得在['render']（https://github.com/artf/grapesjs/blob/43dc05ffecabdb69f880f163f35b033222a7482a/src/stylemanager/view/PropertyView.js#L675）里调用['checkVisibility']（https://github.com/artf/grapesjs/blob/43dc05ffecabdb69f880f163f35b033222a7482...

artf

我打算关闭这个，因为我预计从v0.18开始这个问题会被修复。

查看详情
#30012020年9月4日作者 pjdevries3 个回答
2 个反应

那令人头疼的“确认你想离开”的对话。

目前主要作为一个业余项目，我正在尝试在Joomla中集成GrapesJS！作为编辑器插件。大多数编辑器插件在Joomla！中实现的方式是使用“''来<textarea>保存编辑器数据，就像其他”<form>''字段一样。 我有一个基本的概念验证是可行的;数据被正确加载和保存。不过目前还有一个问题。每当我保存更改编辑数据时，都会跳出令人头疼的“确认您想离开”的对话框。这很奇怪，因为选择离开时，数据似乎保存得很好。 有人能帮我解决这个问题吗？

Ju99ernaut

#2805

pjdevries

@artf 抱歉！

artf

@pjdevries下次回复你自己的问题，如果已经解决了就关闭，谢谢:)

查看详情
#30002020年9月4日作者 alemenciones2 个回答
0 个反应

如何移除 CssCompoer 的风格规则？

兄弟，我正在尝试移除一个样式规则，这是 CssComposer.setRule（“.selector”）的对立面？ 非常感谢！

longdoan7421

遗憾的是，GrapesJS 没有内置函数，比如 'CssComposer.removeRule'。 不过，你可以通过像这样的变通方法做到这一点：通过使用 'CssComposer.getAll（）' 获取所有规则，它会返回一个包含所有规则的骨干集合。我假设你有应该被移除的规则模型，你可以用Backbone Collection的方法“remove”来移除它。 “JavaScript const ruleModel = / 你想移除的规则模型 /; const allRule...

artf

@longdoan7421说得对，但在第二个方案中，我会直接使用 ['CssComposer.getRule']（https://grapesjs.com/docs/api/css_composer.html#getrule） “''js const willBeRemoveRules = 编辑者。CssComposer.getRule（willBeRemoveSelector）; ```

查看详情
#29992020年9月3日作者 jenter3 个回答
0 个反应

禁用阴影主导后，网页组件中的拖拽排序问题

Version 16.10 你能重现演示中的bug吗？ [X] 是的 [ ] 不 预期的行为是什么？ GrapesJS 支持与未启用 Shadow DOM 的自定义 Web 组件的拖拽和排序交互。 描述一下那个虫子 你好，我们广泛使用 GrapesJS，并集成了许多自定义网页组件，这些组件是通过 [StencilJS]（https://stenciljs.com/） 项目生成的。我们遇到的一个问题是将元素拖入 Web 组件。不过，只有在 Shadow DOM 被禁用（“shadow： false”）时才会有问题。 启用暗影DOM：[无Bug] ![ShadowON]（https://user-images.githubuserco...

artf

这个bug/请求不仅针对StencilJS，也适用于Web Components和Shadow DOM。 Grapes 和 Web Components 有没有启用或跟踪事件以调节这些问题的最佳实践？ 我不太接触Web组件，如果你能创建一个可复现的演示（比如在底层用Web Components自定义组件），那会帮助我们调试并理解问题。

jenter

@artf当然，感谢你的快速回复。 我已经在这个Fiddle里导入了我自定义的网页组件库来演示问题：https://jsfiddle.net/jenter77/5btn2ao7/25/ ![小提琴分类]（https://user-images.githubusercontent.com/1368216/92647514-ff08f180-f2b5-11ea-8433-697820d85fe3.gif） 如果你参考我的公开仓库和示例“faux-grid-item”网页组件[这...

artf

你好，Jason，我试着查看编辑器内部的情况，不太清楚“shadow”选项到底如何影响这个行为，但我看到的主要问题是动态的“<div class=”delayed--wrapper“>”元素。 基本上，编辑器（解析后）有这个组件结构 '''html <faux-grid-item> <p>你好</p> <p>你好</p> <p>你好</p> </faux-grid-item> 这种错位让排序器感到困惑，因为“div.delayed--wrapper”并未连接到任何组件。 事...

查看详情

浏览所有主题