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

GrapesJS 问题

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

找到 3,464 个问题

#27862020年5月18日作者 amitbhoj7771 个回答
0 个反应

添加多种文本类型特征

每当我尝试添加多个带有不同条件和标签/属性的性质文本时，却只用最后一个，且每个性质条件都不行。 请帮我解决这个问题。 以下是代码 编辑。DomComponents.addType（'text'， { isComponent： el =>（ （el.attributes&&el.attributes.paraJustify&&el.attributes.paraJustify.value） ）， 型号：{ 默认值：{ 特质：[ { 类型：“选择”， 选项：[ { 值：'text-align：center'，名称：'Center' }， { 值：'text-align：left '， name： 'Left'， { 值： 'text-...

amitbhoj777

找到解决方案了。我们需要在 Traits 中扩展打字文本。谢谢。 编辑。DomComponents.addType（'paraJustify'， { isComponent： el => （（el.attributes && el.attributes.paraJustify && el.attributes.paraJustify.value））， 扩展：“文本”， 型号：{ 默认值：{ 特质：[ { 类型：“选择”， 选项：[ { 值：'text-align：cente...

查看详情
#27852020年5月18日作者 amitbhoj7772 个回答
0 个反应
无效问题

添加多种文本类型特征。

每当我尝试添加多个带有不同条件和标签的文字特征时，每个特征条件都只用最后一个。 请帮我解决这个问题。

artf

先看问题模板，然后提供代码和演示

amitbhoj777

编辑。DomComponents.addType（'text'， { isComponent： el =>（ （el.attributes&&el.attributes.paraJustify&&el.attributes.paraJustify.value） ）， 型号：{ 默认值：{ 特质：[ { 类型：“选择”， 选项：[ { 值：'text-align：center'，名称：'Center' }， { 值：'text-align：left '， name： 'Lef...

查看详情
#27842020年5月17日作者 joshbedo3 个回答
1 个反应
需要更多信息

媒体查询已经坏了吗？

我只是在手机上试试演示 https://grapesjs.com/demo.html HTML/CSS 的渲染 https://us-central1-connectionhelper-6e7ed.cloudfunctions.net/app/api/pages 而且发现它看起来还是桌面版。当我在编辑器里查看移动版时，画面有点不同。有点困惑为什么编辑器的手机预览和实际渲染不一样。 看起来没有任何媒体查询。

vinceumo

你好@artf我确实用代码沙盒 https://github.com/artf/grapesjs/issues/2774 开过一个问题 我的问题其实更多是样式在画布中没有正确渲染。我上面的问题其实是我这边的，因为缺少带有CSS的HTML代码。 非常感谢

montali

我也赞同！

vinceumo

在0.16.12上也有同样的问题，导入带有媒体查询的CSS时，媒体查询中的大部分CSS会被移除，但不会全部？我也试过用Postcs解析器，还是同样的问题。

查看详情
#27822020年5月17日作者 joshbedo1 个回答
0 个反应

渲染存储在 Firestore 中的页面的最佳方式是什么？

我看了很多文档和已关闭的问题，但我对如何渲染存储在 Firestore 中的页面有点困惑。 举个例子，我有一个node.js后端，使用云函数，我想我基本上会有一个API端点，从Firestore拉取页面并渲染。这可能吗？我没找到太多关于如何从服务器渲染页面的示例。 简而言之，我该如何渲染用 Grapejs 生成的页面？这样我就能展示页面预览，同时也能用 Grapejs 生成的网站来做一个实时网站。 例如：

artf

你好，Josh，关于存储和加载模板的详细说明在这里：https://grapesjs.com/docs/modules/Storage.html#store-and-load-templates 基本上，编辑器存储两种类型的数据：“组件”和“样式”，模板的JSON结果。你需要这些来在编辑器中重新加载数据。'html' 和 'css'，你模板的 HTML/CSS 结果。这可以用来渲染到你的最终页面（比如你用户创建的页面），但不要用它来加载回编辑器进行编辑。简而言之，我该如何渲...

查看详情
#27812020年5月16日作者 adamwpe2 个回答
0 个反应

无法在按钮组合内按空格键

大家好， 我有一个按钮组件，它允许我编辑文本，但不允许我输入空格 ''。不过你也可以复制粘贴一个。 我这里有个例子： https://jsfiddle.net/qz2cumo6/2/ 你知道为什么会这样吗？ 谢谢，

Mohsen-Khakbiz

试着添加类似的组件 “JavaScript 组成要素： [ { 标签名称：“button”， 类别：['GJS-button']， 组成要素： [ { 可选：真， 可编辑：正确， 标签名称：“span”， 类型：“文本”， 内容：“编辑我” } ] } ], ```

adamwpe

这是个简单的解决方案——效果非常好。

查看详情
#27792020年5月15日作者 bt0r暂无回答
0 个反应

法语 i18n 翻译修正

描述 大家好， “填充”翻译键在法语中被错误翻译。 由于“Padding”是英语单词，法语中没有必要保留它。更正 修复方法会根据你想触及的用户类型而有所不同。 对于开发者来说，填充和边际非常常见，但如果是针对更“标准”的用户，你应该把边际和边余白分别翻译为内部和外部边距。真实 档案：https://github.com/artf/grapesjs/blob/dev/src/i18n/locale/fr.js#L97-L106 '''JSON 页边：“玛姬”， “margin-top”：“Marge supérieure”， 'margin-right'：“Marge droite”， “左边边距”：“Marge gauche” “...

查看详情
#27782020年5月15日作者 ashishtyd2 个回答
0 个反应
需要更多信息

无法读取 r.getBody 的 null 属性 'querySelector'

嗨 我当时试图在可视化源页面上使用 grapesjs 。 以下是初始值函数—— 'initEditor： function（）{ var self = this; this.editor = grapesjs.init（{ 容器：“#gjs”， fromElement： true， 高度：'500px'， 宽度：“自动” storageManager： false， 面板：{ 默认值：[] }， blockManager： { 附录：'#blocks'， 块：self.wcComponents }, }); this.editor.runCommand（'sw-visibility'）; this.editor.Panels.ad...

artf

请制作一个可复现的演示

no-response[bot]

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

查看详情
#27772020年5月14日作者 kuhelbeher3 个回答
2 个反应

如何在样式管理器中更新样式

你好。我创建了自定义组件，通过自定义资产管理器设置了 backgraound-image 自定义块代码： “JavaScript domc.addType（'image-block'， { 扩展：“默认”， 型号：{ 默认值（） { 返回 { 名称：“背景图片”， 类型：“图像块”， 标签名称：“div”， 虚无：虚假， Droppable：确实如此， }; }, }, 浏览量：{ init（） { this.listenTo（this.model， 'change：src'， this.updateImage）; }, 事件：{ dblclick：“onActive”， }, onActive（） { editor.runCom...

Ju99ernaut

我注意到一般来说，当你通过代码更新某个“组件”的样式时，它们不会反映在“样式管理器”里，除非你取消并重新选择该“组件”，而且我在文档里找不到关于刷新样式管理器的相关说明。 作为一个变通方法，你可以用： “''js editor.selectToggle（model）; editor.select（model）; @Ju99ernaut 不 如果你打算在“样式管理器”之外设置一些样式，可以查看[这里]（https://grapesjs.com/docs/guides/Cust...

Ju99ernaut

这里他们使用#2728： “''js component.addStyle（{ 'background-image'： 'url（'${url}'）' }） ``` 我猜背景图像没有更新是因为设置了“src”属性，而不是“background-image”风格属性。

kuhelbeher

@Ju99ernaut谢你的建议，但很遗憾没成功。 我还注意到像背景大小或背景重复这样的属性在样式管理器中也没有被正确反映，尽管它已经为所选组件设置了。

查看详情
#27762020年5月14日作者 math-artist3 个回答
3 个反应

能否用 grapejs 打印文件？

你好，我需要为桌面应用创建一个拖放模板编辑器，生成漂亮的报表，但几乎找不到能轻松做到的。后来我发现了 Grapejs，正在考虑使用 Qt WebEngine 并在我的应用中嵌入 Grapejs。 我可能在1-2年内会有一个基于网页的应用版本，所以这可能是更好的长期解决方案。 但我还需要正确打印带有页眉和页脚的文档，并且像“纸质”文档编辑器一样管理高宽。 我的想法是个坏主意吗？有没有更好的框架来描述我想做的事情？我搜索过，没有找到任何非从零构建的线索。

Ju99ernaut

我觉得 grapesjs 非常适合你的使用场景。这里#2724很可能也是在同样的语境下使用。

Ju99ernaut

对于页面，这需要创建一个定义高度的页面[块]（https://grapesjs.com/docs/modules/Blocks.html#custom-render）。至于变量标签，也可以包含在区块里。

math-artist

好的，这似乎是管理长列表或表格的正确解决方案。 有没有办法锁定网页高度，并在编辑时看到布局限制？我的计划是创建3到4个相同的页脚，并在布局中插入变量标签，以动态填充这些页面。

查看详情
#27752020年5月14日作者 motazad1 个回答
0 个反应

“最小宽度”和“最大宽度”的使用结合

我如何在config.mediaCondition中使用“最小宽度”和“最大宽度”？ 我打算把这些变化分配到不同尺寸的设备

artf

https://github.com/artf/grapesjs/issues/2752#issuecomment-630137698

查看详情

浏览所有主题