GrapesJS 问题

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

状态

排序

找到 466 个问题

🔍 components

#36152021年7月13日作者 onmagic4 个回答

0 个反应

组件常规

文本组件无法更新，无法从toHTML获得最终结果。

它是文本成分，如果选择正文，文本会在组件到HTML方法中进行修正保存/应用/存储，如果只是更新文本，但不保留文本部分，只需点击保存然后使用“editor.getHTML（）”，结果不会更新。 ![Snap77]（https://user-images.githubusercontent.com/6985829/125385798-c8b46b00-e3cd-11eb-99e3-53b7b915672b.jpg）

v-pasha2

你找到解决办法了吗？

v-pasha2

我们在“0.17.19”版本遇到以下问题，而在“0.14.62”版本中运行正常。我们尝试的是内联编辑体验，所以当我们检查component.getEl（）函数时，它返回的是组件的更新文本，而如果用component.toHTML（），它会返回旧值，而不是更新后的值。虽然重点仍然是文本部分。参考HTML。 toHTML（） out out <div id=“i8h4tu”><p id=\“iwcefk\”>本网站使用示例数据进行说明。你可以用多个模板来构建页面。</p><...

v-pasha2

@artf你能帮我检查一下，或者有什么解决办法吗？

查看详情

#36132021年7月12日作者 anlumo2 个回答

1 个反应

提问组件缺陷 style-manager typescript

Inconsistent Image Selection

版本： 0.17.19 你能重现演示中的bug吗？[X] 是的[ ] 不可重复[此处]（https://grapesjs.com/demo.html）。预期的行为是什么？在资产管理界面中点击图片选择。详细描述那个漏洞目前的行为是什么？** 当你更改与图片组件关联的资产时，只需一键即可更改，然后点击X图标关闭对话框。当你想更改与“背景图片”风格关联的资产时，单击不会改变任何东西，它只会在对话框中选择该资产。你必须双击它才能更改“背景图片”，这样对话框也会关闭。这两种情况应该表现得相同。

artf

听起来很正规，下次更新会更新

GJSBlock

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

查看详情

#36122021年7月12日作者 TRIGGEREDcoder4 个回答

0 个反应

提问 style-manager 组件缺陷 typescript

Grapesjs滑块按钮、标签键都没有按预期工作

版本 0.17.19（grapesjs）版本 0.1.5（grapesjs-lory-slider）版本 1.0.6（grapesjs-tabs）你能重现演示中的bug吗？不预期的行为是什么？我应该能在点击前一、下一页按钮和标签名时，浏览不同的幻灯片和标签页。详细描述那个漏洞当我在模板中创建滑块，编辑不同的幻灯片并在grapesjs上查看时，我就能浏览所有创建的幻灯片。同样地，创建标签块后，我也能看到里面不同的标签和内容。但当我把生成的 html 和 css 代码带到 Angular 应用中尝试运行时，我无法像在 grapesjs上创建时那样，穿越不同的标签页或内容，也无法切换幻灯片或内容。 HTML和CSS由gr...

artf

你能提供一个可复现的演示吗？

TRIGGEREDcoder

抱歉@artf，我遇到这个问题是因为生成的HTML里有脚本标签，而在Angular组件HTML中这个标签没有用。如果 HTML 包含脚本标签函数，我该如何使用 Angular 文件生成的 html？

artf

@TRIGGEREDcoder如果主要问题解决了，我就要关闭这个。如果你有问题，请开设一个新的讨论区

查看详情

#36082021年7月9日作者 anlumo4 个回答

0 个反应

增强组件提问

Disable Dragging

你想给GrapesJS添加什么？我已经实现了一个替代的文本编辑组件（不是基于RTE）。我希望人们能在这个组件中拖曳选择文本。详细描述你的功能需求详细问题是拖拽选择还会触发拖拽整个组件。我想只通过移动工具栏的项目来移动页面上的组件，以避免它干扰文本选择。最新版本有替代方案吗？我目前这样覆盖了拖拽： “''js element.addEventListener（'dragstart'， event => { event.stopPropagation（）; event.preventDefault（）; 返回false; }，真）; ``` 在视图的“init”函数中。这在 Chrome 上算是能用，但不总是有效，而且在 F...

iabhiyaan

“''js editor.on（'component：drag：start'， props => { const { target } = props; target.set（{ 可拖拽：错误，传播：['可拖拽'] }); }); ```

anlumo

这样不就禁用了所有拖拽，甚至是工具栏和图层管理器里的拖拽吗？

anlumo

我刚测试了，另一个问题是拖拽操作仍然吞噬事件，只是渲染了组件被禁用。

查看详情

#36062021年7月9日作者 Palash-Mandal2 个回答

0 个反应

提问组件 style-manager typescript

如果我用对齐浮子的浮点，不清楚，这就是设计问题发生的原因。

你好，@artf，尝试用浮点表单对齐创建布局时，有一个通用的问题。问题是浮点不会自动清除。 ![图片]（https://user-images.githubusercontent.com/17553816/125087079-d32ee600-e0e9-11eb-8a08-15020c15b8fd.png）当用户设置流值浮点（float left /right）时，我该如何在行中添加新类 '<div data-gjs-type=“default” draggable=“true” data-highlightable=“1” class=“row” id=“iroj”><div data-gjs-type=“default”...

artf

请遵循议题模板

GJSBlock

谢谢你举报，@Palash-曼达尔。关于如果我用对齐浮子的浮子，不清楚这就是设计问题的原因。推荐的 StyleManager 方法是使用事件驱动的 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'so...

查看详情

#36052021年7月9日作者 aryanchopra1 个回答

0 个反应

style-manager 组件 typescript

Adding selected component style to a block

所以我正在尝试获取选中的组件并用它做一个块，但是我在添加它的 CSS 时遇到了困难。我目前的做法是这样的： “编辑。BlockManager.add（widgetname， { 标签：控件名称，内容：editor.getSelectedAll（），类别：panelname，属性：{ 标题：widgetname，类别：图标级 }, });` 任何线索都会很有帮助:)

GJSBlock

谢谢你举报，@aryanchopra。感谢你分享关于向模块添加选定组件样式的报告。为了帮助团队调查并优先排序：请提供：一个最小可复现的例子（CodeSandbox/JSFiddle）你的GrapesJS版本号浏览器和操作系统信息浏览器控制台的任何错误信息重现问题的步骤最有帮助的是什么：简约代码示例（不是你整个项目）屏幕录制或截图显示问题明确区分预期行为与实际行为你正在使用的GrapesJS配置有了这些细节，维护者可以更快地识别和优先排序修复。Gra...

查看详情

#36042021年7月9日作者 NoumanAhmad-Braqsol3 个回答

0 个反应

组件常规

Editor.ON（'component：update：content'， model => { }}）在某些原因下无法工作

如果用户删除元素中的所有文本并点击其他地方。然后再试着选择空元素，他又选不中，因为它是隐藏状态，我不知道它去哪了。所以针对这个问题，我用的是这段代码该代码在文本中设置空格，如果用户从元素中移除所有文本。通过这样做，这些元素不再是空元素，因此 i 不会隐藏。我们再次选择。如果用户逐个移除文本字符，则运行良好。但现在的问题是，如果用户用 CTRL + A 选择文本，然后用退格键删除。目前上述代码无法使用。有人能帮帮我吗？

artf

正如这里已经建议的 https://github.com/artf/grapesjs/issues/3603#issuecomment-885305546 避免现在这样操作，添加一个简单的默认CSS，以防元素空着

NoumanAhmad-Braqsol

谢谢，我明白了！

GJSBlock

感谢你报告，@NoumanAhmad-Braqsol。感谢你分享关于 editor.on（'component：update：content'， model => { }}）在某些原因下无法正常工作的报告。为了帮助团队调查并优先排序：请提供：一个最小可复现的例子（CodeSandbox/JSFiddle）你的GrapesJS版本号浏览器和操作系统信息浏览器控制台的任何错误信息重现问题的步骤最有帮助的是什么：** 简约代码示例（不是你整个项目）屏幕录制或截...

查看详情

#35992021年7月7日作者 niranjank1512 个回答

0 个反应

style-manager 提问组件文档画布

@keyframes即使我通过关键帧对象后也没有添加

你好，@artf，我已经添加了 '让CC = 编辑器。Css作曲家; cc.setRule（'.fadetop-animate'， { 不透明度：0，'animation-name'： 'fadeTop' }， { atRuleType： 'keyframes'， atRuleParams： 'fadeTop'，选择器：“to”，风格：{ 不透明度：1 } });` 根据文件[]（https://grapesjs.com/docs/api/css_composer.html#setrule）但关键帧规则不会被添加到组件中。如何为组件样式添加关键帧？

artf

用这个 “''js 编辑。CssComposer.getAll（）.add（'@keyframes fadeTop { ... }'） // 你的CSS字符串 ```

GJSBlock

谢谢你举报，@niranjank151。关于@keyframes即使我传递关键帧对象后也没有添加，这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => conso...

查看详情

#35942021年7月6日作者 maxtsh3 个回答

1 个反应

提问组件缺陷 typescript

当编辑器的父滚动时，将鼠标悬停在组件上，显示错误位置

版本：0.17.19 你能重现演示中的这个bug吗？不会，因为是全屏，没有父容器滚动功能。预期的行为是什么？悬停状态干部以查看部件位置的变化详细描述那个漏洞当我想选择或悬停在特定组件上时，由于父滚动，干部位置显示错误。在0.17.19之前没有这种情况，当时还算正常。你能上传截图、截图或实时演示吗？是的 ![Screenshot_17]（https://user-images.githubusercontent.com/38842256/124558368-c42d0700-de4f-11eb-936f-881fc0cd57ea.png）

artf

如果可滚动元素不是编辑器的父节点，你可能需要这个选项 https://github.com/artf/grapesjs/blob/dc45604962e4e6a4a075f19d5de67090bac15fa5/src/editor/config/config.js#L157-L163

no-response[bot]

由于我们请求原作者提供更多信息未获回应，本期已自动关闭。仅凭当前期刊中的信息，我们没有足够的信息采取行动。如果您有答案或找到我们需要的答案，请随时联系我们，以便我们进一步调查。

GJSBlock

谢谢你举报，@maxtsh。当编辑器的父滚动时，将鼠标悬停在组件上，显示错误位置的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：如果还没测试过，请用最新的GrapesJS版本测试提供最小可重复的示例（CodeSandbox）——这有助于团队...

查看详情

#35872021年7月2日作者 milan-holes2 个回答

0 个反应

组件缺陷提问 typescript

我如何创建 Grapesjs 服务，用来从存储的组件生成 HTML？

你好。有没有可能创建 Grapesjs 实例，而不生成整个编辑器？我创建了带有异步数据的自定义组件，需要在Node中创建后端服务，该服务从存储的组件生成HTML输出，并填充API的数据。现在我出现错误了：ReferenceError：窗口未定义谢谢。

artf

我会把它关闭为重复 https://github.com/artf/grapesjs/issues/3399

GJSBlock

谢谢你举报，@milan混蛋们。错误错误：ReferenceError：窗口未定义发生在组件在组件生命周期完全初始化前尝试访问属性时。这是GrapesJS中常见的竞争条件。立即解决办法：如果你控制代码，可以用空检查包裹调用： “JavaScript if （component && typeof component.method === 'function'） { 你的准则 } ``` 根本原因分析：组件在调用你的方法之前不会验证状态。当多个操作同时发生时，这会...

查看详情

GrapesJS 问题

浏览所有主题