GrapesJS 问题

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

状态

排序

找到 466 个问题

🔍 components

#37272021年8月26日作者 SintoDema4 个回答

1 个反应

提问 style-manager 组件缺陷 keyboard

Issue on Style Import

你好，@artf，详细描述这个漏洞在用 GrapesJS 创建新模板时，我遇到了一个情况：当我们尝试从 import modal 导入 CSS 时，编辑器中没有反映出来。在一个空白编辑器上，我创建了一个模板，添加了HTML和CSS。之后，我需要在CSS部分做一些修改，为此，我选择了编辑器顶部的导入选项，滚动到底部的样式标签。我看到了导致问题的样式，我选中并删除了它。之后，我点击了导入按钮。然后我检查了模板，样式问题依然存在。于是我再次打开导入模态确认样式不存在，并正确地移除了它。我看到我移除的风格还在风格标签里。我尝试过多次删除并导入。它没有从编辑器中移除。我再次打开导入模态时，它就在了。目前的行为是什么？从导入模态中移...

artf

你好@javadsamiee这个问题在最新版本的预设插件上已经修复了

artf

你好，@SintoDema问题就在这里 https://github.com/artf/grapesjs-preset-webpage/blob/3e5a9e12998c9a32b6f1199953084163678e6c17/src/commands/openImport.js#L15-L18 如你所见，它更新了组件，但不会清除样式模块。我现在没时间做那个插件，但我建议你在那里开个问题/PR，总有一天我会修复的。

javadsamiee

你好@SintoDema问题就在这里 https://github.com/artf/grapesjs-preset-webpage/blob/3e5a9e12998c9a32b6f1199953084163678e6c17/src/commands/openImport.js#L15-L18如你所见，它会更新组件，但不会清除样式模块。我现在没时间做那个插件，但我建议你在那里开个问题/PR，总有一天我会修复的。 @artf 这个问题有最新进展吗？

查看详情

#37172021年8月21日作者 Vikash-ra2 个回答

0 个反应

style-manager 组件 typescript

Template does not load using just components

我正在尝试加载一个已有的模板。我认为它应该能支持组件或 HTML，但似乎只能通过 HTML 运行。以下代码无法使用，但带有相应HTML的代码可以。着陆页的 JSON 是从开发者工具栏面板取的 “''js const LandingPage = { “html”：null， “components”： “[{'type'：'text'，'attributes'：{'id'：'i0fq'}，'components'：[{'type'：'textnode'，'removable'：false，'draggable'：false，'highlightable'：0，'copyable'：false，'selectable'：true，...

artf

@Vikash-ra创建问题时请遵循该模板。

GJSBlock

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

查看详情

#37142021年8月18日作者 ltenti2 个回答

0 个反应

组件提问增强画布 typescript

Partial parse

讨论于 https://github.com/artf/grapesjs/discussions/3711 <div type='discussions-op-text'> <sup>最初由 ltenti 于 2021 年 8 月 17 日发布</sup> 大家好，我想知道如何应对这种情况：我必须允许我的应用用户编辑网页网页上有用户无法编辑的固定部分整个HTML由服务器端的遗留子系统生成，但其中的部分必须由用户自由编辑我实现了一个自定义组件，可以从服务器获取遗留的 HTML，并用 model.components（data）语句“注入”到画布中。我在考虑创建一个新的组件类型（类似doNotEditMe），属性“editab...

artf

https://github.com/artf/grapesjs/discussions/3711#discussioncomment-1234837

GJSBlock

谢谢你举报，@ltenti。关于部分解析的好建议！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。使用事件系统： “JavaScript editor.on（'component：update'，（component） => { 你的逻辑 }); ``` 替代方法：听取“selector：add”以获取CSS选择器更改使用“selector：custom”来表示自定义规则利用“change：*”事件进行细致跟踪构建一个插件，扩展编...

查看详情

#37132021年8月18日作者 shkhalid3 个回答

1 个反应

文档组件提问 typescript

Stored components with script can not be rendered properly

我在尝试保存一些组件（包括一些脚本）并重新加载页面时遇到了一些问题，组件渲染不正确。显示的是空盒子。举个例子：当我尝试从“jvas28/grapesjs-echarts”保存图表组件并重新加载页面时，会出现这种情况 <img width=“1438” alt=“截图 2021-08-18 下午4点20分” src=“https://user-images.githubusercontent.com/8138036/129891078-2191094d-d735-4178-9859-588f774120b6.png”> 这是示例应用 https://codesandbox.io/s/cranky-wescoff-93pxd?fil...

shkhalid

谢谢@artf！最后我终于弄明白了问题出在“tagVarStart”和“tagVarEnd”。评论完后它开始起作用了

artf

@shkhalid谢谢你的报告，但在这个仓库里，你应该打开可重现的问题，不使用外部插件，因为问题可能出在插件本身。至少就我对核心的判断来看，如果按照这个[指南]（https://grapesjs.com/docs/modules/Components-js.html）正确实现，组件中没有问题。

GJSBlock

谢谢你举报，@shkhalid。关于用脚本存储的组件无法正确渲染的好问题。推荐的组件方法是使用事件驱动的API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something changed'））; 组件...

查看详情

#37072021年8月16日作者 denisoed1 个回答

0 个反应

提问组件增强 typescript

Is it possible to set up the rendering of Vue components?

GrapesJs 是最好的页面构建器！：心：抱歉，我是GrapesJs的新手。我可以支持Vue组件吗？

GJSBlock

谢谢你举报，@denisoed。关于是否可以设置Vue组件的渲染？的建议很棒！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。使用事件系统： “JavaScript editor.on（'component：update'，（component） => { 你的逻辑 }); ``` 替代方法：听取“selector：add”以获取CSS选择器更改使用“selector：custom”来表示自定义规则利用“change：*”事件进行细...

查看详情

#37062021年8月15日作者 momu-20161 个回答

0 个反应

style-manager 组件 typescript

Css in block can not be removed when block has been removed

Grapesjs 版本 v0.16.45，我尝试使用 countdown 插件（[https://github.com/artf/grapesjs-component-countdown]（https://github.com/artf/grapesjs-component-countdown）），当我删除整个组件时，一切都运行良好通过工具栏，html 和组件被移除，但样式和 css 仍然在本地存储中。让我困惑的是，演示演示中整个组件都被删除了，CSS 也被删除了。同样，我自己一些模块中的 CSS 也无法删除。请帮我指出问题所在。非常感谢！

GJSBlock

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

查看详情

#37032021年8月13日作者 anatoli-dp2 个回答

0 个反应

提问文档组件缺陷画布

自定义ID在CSS中注入\3，\3后面有空格，\3后面有空格

警告请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下，看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答，否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 版本：最新发布你可以在控制台输入“grapesjs.version”获得版本你能重现演示中的bug吗？[ ] 是的[ ] 不预期的行为是什么？如果有一...

anatoli-dp

请注意，这个问题很糟糕......现在看到它，我觉得自己很傻......ID不能以数字开头，我做这个时没考虑到这一点

GJSBlock

谢谢你举报，@anatoli-DP。自定义ID在CSS中注入\3，\3后面有空格的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：如果还没测试过，请用最新的GrapesJS版本测试提供最小可重复的示例（CodeSandbox）——这有助于团队...

查看详情

#37002021年8月12日作者 anatoli-dp3 个回答

3 个反应

提问组件缺陷增强文档

Setting draggable: 'wrapper' does not drop in wrapper

警告请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下，看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答，否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 版本：目前，我会更新每次发布你能重现演示中的bug吗？使用自定义编辑器，因为我需要自己制作组件[ ] 是的[ ] 不预期的行为是什么？将组件设置为可拖...

artf

这里的字符串本应是查询字符串，所以它尝试查询一个“封装”标签，而显然这个标签不存在。编辑器会在帧中的所有组件附加“data-gjs-type”属性，所以你能用的查询是“可拖拽：”[data-gjs-type=wrapper]''

anatoli-dp

啊，现在明白多了......谢谢，问题解决了

GJSBlock

谢谢你举报，@anatoli-DP。设置可拖拽：'wrapper' 不会在 wrapper 中掉落的问题似乎是竞态条件或状态管理时序的问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：如果还没测试过，请用最新的GrapesJS版本测试提供最小可重复的示例（CodeSandbo...

查看详情

#36992021年8月12日作者 diegoSenra4 个回答

0 个反应

组件缺陷画布 style-manager typescript

Cell hovering randomly displaces from actual cell

嗨！我在公司的一个项目中使用 grapesJs 邮件编辑，配合Newsletter插件。一切都运行得很好，除了我无法解决的这个bug：有时候，当我在画布里拖动方块时，单元格的悬停会被打乱。最大的问题是这种行为完全随机，有时会发生也可能不会，但一旦发生真的很烦人。唯一的模式是：只在放块后且独家地在画布上进行拼接如果我调整画布大小以适应移动端/平板，画布会恢复正常（即使切回桌面视图——但放置新方块时可能会再次发生）位移仅发生在垂直方向（随机向上或向下——通常是向上——且可以是任意位移大小）单元格选项菜单（选择父单元、移动组件、擦除单元格等）也会被移位，方式相同。编辑器插入在一个内容较多的页面（侧边栏和页眉）。我不得不更改一些...

artf

你用的是最新版本吗？

diegoSenra

使用压缩后的0.10.7

artf

抱歉兄弟，这是4年前的版本，帮不上忙。你试着更新了吗？

查看详情

#36942021年8月11日作者 codingmachine161 个回答

0 个反应

组件提问画布 typescript

Dynamic Changes vanish when load from DB

@artf 这是我的代码，我在 select change 时在 div 里添加 test init（） { this.listenTo（this，“change：noOfLinks”，this.getInfoLinks）; }, getInfoLinks（） { let canvasDoc = 编辑器。Canvas.getDocument（）; canvasDoc.getElementById（“infoLinks”）.innerHTML = “test text ”; editor.trigger（“change：selectedComponent”）; 编辑。TraitManager.getTraitsViewer（）.re...

GJSBlock

谢谢你举报，@codingmachine16。关于问题：动态变更在从数据库加载时消失，这个问题非常好。推荐的 Canvas 方法是使用事件驱动的 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'som...

查看详情

GrapesJS 问题

浏览所有主题