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

GrapesJS 问题

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

找到 545 个问题

🔍 typescript
#32772021年2月18日作者 FrancoFasano2 个回答
1 个反应
提问缺陷增强typescript

Default PDF size: US letter How to set A4?

警告 请阅读并遵循接下来的三步，然后在发布问题前删除它们JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl *版本：0.16.3 你可以在控制台输入“grapesjs.version”获得版本 你能重现演示中的bug吗？ [X] 是的 [ ] 不 预期的行为是什么？ 一个设置或文档，帮助开发定义PDF大小 详细描述那个漏洞 这其实不算是bug，而是设置问题。 我无法将PDF尺寸改成A4，代码中找不到允许从A4开始的参数或配置 目前的行为是什么？ 我用 grapesjs 在 invoicenin...

artf

你好，Franco，你可以通过更改[devices]（https://grapesjs.com/docs/api/device_manager.html）来定义帧大小。

GJSBlock

谢谢你举报，@FrancoFasano。 默认PDF大小：美式字母 如何设置A4？的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队...

查看详情
#32762021年2月18日作者 ThomasPof2 个回答
0 个反应
typescript常规

CleanId function not working with MJML code

这个问题是关于 MJML 代码的，但我觉得这更多是关于 grapesjs 而不是 grapesjs-mjml 有一个函数可以移除“src/code_manager/model/HtmlGenerator.js”中不必要的ID。这个函数在 HTML 标签上表现良好，但在 MJML 标签上就不行了。 我发现的是

artf

https://github.com/artf/grapesjs/releases/tag/v0.16.41

GJSBlock

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

查看详情
#32722021年2月17日作者 ThomasPof4 个回答
0 个反应
提问缺陷typescript

Id are added to <img/> on double click on it

版本： 0.16.37 你能重现演示中的bug吗？ [X] 是的 [ ] 不 预期的行为是什么？ 这是关于GrapesJS-mjml插件的：这个语法不接受元素上的ID。但AssetsManager会给图片元素添加ID。我不想在标签中添加 id 属性<img> 繁衍步骤克隆并运行项目在index.html文件中添加图片打开代码查看器：无ID双击图片关闭资产管理公司打开代码查看器：标签中已添加一个ID。 你可以在这里找到GrapesJS-mjml的问题：https://github.com/artf/grapesjs-mjml/issues/179

ThomasPof

ID（ID）似乎是在打开资产管理系统之前就添加的：克隆并运行项目在index.html文件中添加图片检查该图像元素：dom元素中有ID。

ThomasPof

在“/Users/thomaspopoff/Sites/grapesjs/src/code_manager/model/HtmlGenerator.js”第10行找到了线索，“opts.cleanId”总是未定义。我不知道怎么把它设置为true来移除自动生成的ID。

ThomasPof

抱歉我说了这么多：在 'getHtml（）' 函数里有一个选项 'opts.cleanId'，你可以配置去移除自动生成的 ID......

查看详情
#32702021年2月15日作者 haizenbergD2 个回答
0 个反应
提问组件typescript

How to export JS code from angular components?

嘿，我在我的Angular应用里用的是Grapesjs 我有一个自定义的 Angular 组件（基本上是用 angular 创建的自定义 HTML），我正在尝试用“grapesjs-plugin-export” 导出内容 我遇到的问题是导出后，没有 JS 代码（最初在 Angular 组件里）能用 HTML 做我需要的事。 我想知道你能不能帮我解决这个问题。 <img width=“1025” alt=“截图 2021-02-15 上午11：41 37” src=“https://user-images.githubusercontent.com/51407611/107929782-cf57c700-6f82-11eb-8c8f...

artf

你可以在这里了解更多关于带有 js 的组件信息：https://grapesjs.com/docs/modules/Components-js.html#basic-scripts

GJSBlock

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

查看详情
#32692021年2月12日作者 acondura4 个回答
0 个反应
文档增强提问style-managertypescript

Translating html string

图书馆很棒！它满足所有要求，唯独有一个：网站文本翻译。 我在议题队列和文档中翻遍了各种地方，但不知为何找不到关于这个话题的任何信息。我的客户不在乎 grapesjs 编辑器是英文的。他们想要的是能够轻松地将文本翻译成网站的任意语言。 如果首页页头写着“欢迎访问我的网站”，他们会希望有一个简单的选项：将鼠标悬停在该文本，点击下拉菜单，然后点击翻译，可能会弹出弹窗，将该行翻译成法语或其他他们想用的网站语言。当然，访客还需要一个语言下拉选择器。 有类似的吗？如果不行，这种插件的粗略结构应该是什么？

artf

这需要你自己去做。也许可以自定义文本组件，这样可以根据所选语言更改内容。

jordandevogelaere

@acondura你有解决办法吗？我对我的客户也有同样的要求。 谢谢

gxanshu

我也有同样的要求。是的，我们唯一能实现这一点的方法就是创建自己的组件

查看详情
#32682021年2月12日作者 theSC0RP4 个回答
0 个反应
提问增强画布typescript

How to add javascript in the html without sanitization?

@artf，我正在接收用户的JavaScript输入。我需要在模板HTML里添加这个JavaScript，但它会被净化。 有没有办法关闭消毒功能？（我对你提到的#3245问题没有意见）或者你能在编辑器里添加类似“allowSanitization： false”这样的属性吗？ 如果不行，那我该如何把JavaScript添加到画布上？

theSC0RP

我尝试在画布渲染的iframe中添加脚本，在<script>iframe正体末尾加了“'标签。这在某种程度上是可行的。问题是，当我需要更新脚本中的 js 时，我需要刷新 iframe（如果有事件监听器就移除），这样做会出现以下错误： ![截图来自2021-02-18 10-54-24]（https://user-images.githubusercontent.com/30771519/108309560-beec5a00-71d7-11eb-9bfe-e7a48c5e6f...

artf

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

theSC0RP

谢谢你的回复@artf。 我更新iframe时出错了，现在问题解决了！ 再问一下，有没有内置的方法可以刷新iframe？

查看详情
#32662021年2月9日作者 amliu2 个回答
0 个反应
提问组件typescript

如何知道所选组件是从哪个方块生成的？

想知道如何进行反向查找，从组件回溯到模块。 我用 Block Manager add（） 初始化后添加一个类似的方块。 如果选中的组件是由这个自定义块生成的，我该怎么办？

artf

你应该更多地考虑组件而不是方块，确实合适的方块应该看起来更像这样。 “''js 编辑。BlockManager.add（'block-id'， { 唱片公司：... 内容：{ 类型：'component-id' }， }) 一旦丢弃了那个方块，你总能获得那个属性 'component.get（'fromBlock'）'

GJSBlock

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

查看详情
#32652021年2月5日作者 jcamejo3 个回答
0 个反应
缺陷提问typescript

RenderField in traitView does not handle null or undefined

嗨，@artf！ 在编辑我的一个自定义特质时，我遇到了一个问题，原因不明，createInput 返回了未定义状态。 我注意到TraitView renderField方法不处理虚假值 它直接尝试附加一个未定义的对象，从而引发错误。 我应该在这里加个验证，检查对象是否存在，还是应该在别处做？createInput是否应该负责总是返回定义好的对象？ 谢谢！

artf

你好，Juan，谢谢你的报告，是的，实际上“createInput”需要你返回一个HTML字符串或HTMLElement。我觉得这种情况下有错误是好事，但我猜错误不够明确。 说实话，我不知道这里最好的“修复方法”是什么，因为在代码里静态检查所有 API 并不是一个可扩展的解决方案

WebDevXpert

你好，@artf！ 希望你一切安好。 我在使用 Grapesjs 插件 Publish S3 时遇到了问题。 我该如何使用那个插件并发布我的数据？？

GJSBlock

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

查看详情
#32622021年2月4日作者 lacieri2 个回答
0 个反应
style-manager提问组件accessibilitytypescript

Parse styles to a Css string

你好@artf！ “JavaScript “编辑”： { “CSS”： “* { 框大小：border-box; }#wrapper{字体家族：Helvetica，Arial Black，无衬线;color：#9500b3;}“， “html”：“<div id=\”iecr\“>将你的文本插入此处</div>”， “资产”：“[]”， “styles”：“[{\”selectors\“：[\”#wrapper\“]，\”style\“：{\”font-family\“：\”Helvetica，Arial Black，无衬线\“，\”color\“：\”#9500b3\“}}，]”， “组件”：“[]” } } ``` 有没有办法...

artf

你应该可以用“editorInstance.getCss（）”从任何 GrapesJS 实例中获取 CSS。这基本上是从“样式”JSON 生成 CSS

GJSBlock

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

查看详情
#32612021年2月4日作者 nithinpillalamarri1231 个回答
0 个反应
提问缺陷文档style-managertypescript

How to customise the grapes js form to append style

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

GJSBlock

谢谢你举报，@nithinpillalamarri123。 如何自定义 grapes js form以附加样式的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： 检查初始化顺序 — 确保组件在操作前已完全加载 使用编辑器的事件系统 — 收听完成事件： 推荐的下一步步骤： 如果还没测试，请用最新的 GrapesJS 版本测试 提供最小可重复的示例（CodeSa...

查看详情

浏览所有主题