PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。 获取抢先体验
已收录 3,464 个 GitHub 问题 — 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。
找到 3,464 个问题
你好，@artf， 当我悬停在图像组件上时，如何更改标题？ 喜欢这张图片中高亮的文字： ![图片]（https://user-images.githubusercontent.com/44081652/62636455-35f43180-b957-11e9-8270-edcd12fca966.png） 谢谢！
zgover
在组件上设置'custom-name'属性。
artf
“自定义名称”已被弃用，改用“name”
Chaitwo
非常感谢@Zachary1748和@artf的帮助，效果非常好。 我更新了getName函数，并更改了图片的name属性。 ' name = name == 'image'？'图片（双击上传图片）'：名称;'
你好， 我只是想跟着“入门指南”操作，但在最初的难关之一就失败了，似乎无法从[#add 块]（https://grapesjs.com/docs/getting-started.html#add-blocks）部分添加任何模块。 我在这里创建了一个小提琴（https://jsfiddle.net/phv7k8s9/1/）
smik3
换成不同的 CDN（用 unpkg 代替 cdnjs）似乎解决了这个问题——我猜那是 cdnjs 上的旧版本。
你好。 应用程序中有一些PNG图标：flex-just-start.pngflex-al-end.pngflex-just-sp-bet.pngflex-dir-col.pngflex-just-sp-ar.pngflex-al-start.pngflex-dir-row.pngflex-just-end.pngflex-just-sp-cent.pngflex-dir-col-rev.pngflex-al-str.pngflex-al-center.pngflex-dir-row-rev.png 我也做过类似的，但用SVG格式。请参见[附加文件夹]（https://drive.google.com/open?id=189-erU...
artf
哇，非常感谢@vegadesign非常感激。我们实际上只在演示（[gh-pages]（https://github.com/artf/grapesjs/tree/gh-pages）分支）中使用这些，链接如下： https://github.com/artf/grapesjs/blob/be39c6baf55f4e644b6bc8bbdd71ead71723dd6b/demo.html#L53-L91 我会尽快更换，但如果你能自己创造个人纪录，那将非常感激
嗨。我有一个预定义的模板 json，包含一组 html 元素和样式，这些元素在 grapesjs 加载时会解析成组件集合。CSS 包含了一些默认的媒体查询规则，我想保留这些规则用于模板。命令 editor.getHTML（） 和 editor.getCSS（） 在页面加载时返回正确的值。我希望能够分别修改HTML和CSS代码并重建组件。 如果我尝试用相同的HTML和CSS代码保存模板，组件在画布重置后，预设的媒体查询会丢失： 简而言之，我正在做以下几件事： 你能给个解决方法的提示吗？
artf
请提供一个可复现的演示
no-response[bot]
由于我们请求原作者提供更多信息未获回应，本期已自动关闭。仅凭当前期刊中的信息，我们没有足够的信息采取行动。如果您有答案或找到我们需要的答案，请随时联系我们，以便我们进一步调查。
abozhinov
我也有同样的问题。这就是我的问题 -> https://github.com/artf/grapesjs/issues/2843
编辑。BlockManager.add（'testBlock' + i， { 标签：“盒子” + i， attributes： { MyAttribute： 'hi'}， 内容：HTML }) 我能做那样的事吗？还是我需要使用标准的HTML属性？ 我试过了，但没成功 谢谢。
artf
它按预期运作 https://jsfiddle.net/90y7wuo8/ 下次制作一个可重复的演示
@artf你好， 我稍微定制了你的 grapes。 示例： 我有重复x的背景，比如这里： ![Schermata 2019-08-04 alle 12 06 00]（https://user-images.githubusercontent.com/17646742/62422289-5a7ab000-b6b0-11e9-9e7c-0cfc7437523a.png） 但在自定义CSS中，结果被分为重复-x和重复-y两个 ![Schermata 2019-08-04 全部12 02 42]（https://user-images.githubusercontent.com/17646742/62422308-b0e7ee80-b6b...
artf
这是因为你浏览器的CSS解析器（[这里]（https://grapesjs.com/docs/guides/Custom-CSS-parser.html#cssom-results-are-inconsistent），我们会解释发生了什么）。 唯一的解决办法是使用自定义的CSS解析器。目前，我们提供 [grapesjs-parser-postcs]（https://github.com/artf/grapesjs-parser-postcss）
pouyamiralayi
嗨！当你指定只重复X时，你期望得到什么结果？
miky9585
如果我切换到自定义CSS，背景重复的两行会被擦除并替换成背景重复：repeat-x，CSS composer会帮我替换并拆分成这两行。所以我觉得这个问题不在 trait manager 里，而是在 css composer，但我没看到有专门的代码行专门处理 CSS 代码
你好！最近我注意到这个[问题]（https://github.com/artf/grapesjs/issues/1691）。 我觉得有这个功能会很有帮助。与@artf建议的用Canvas脚本作为全局注入方式的方法不同，我认为这并不适合该功能的主要目的。我认为拥有全局变量和函数的主要用例是脚本在画布内部的处理方式：对于每个组件类型，每次渲染画布时都会执行一个函数。所以如果你在脚本中为某些事件注册了某种处理程序，你无法管理这些处理程序（比如将它们从事件中分离），因为每次渲染画布时执行上下文都会丢失。所以我们需要在全局范围上定义处理程序。 常见的解决方法是[这里]（https://github.com/alvimm/grapesjs-e...
artf
抱歉@pouyamiralayi，我相信你没完全理解组件中 script 属性的全部含义（显然[你不是唯一一个]（https://github.com/artf/grapesjs/issues/358#issuecomment-333818540），即使我试图解释这个“脚本悖论”[这里]（https://grapesjs.com/docs/modules/Components-js.html#basic-scripts）） #1691 里问的问题根本说不通，因为 scrip...
pouyamiralayi
感谢你的善意回答@artf。在挣扎了一段时间后，我终于觉得你说的完全合理。我刚才提这事真是太天真了，抱歉。目前的变通方法完全正确，是Canvas Global Scripts的补充。 对于那些试图实现全局脚本与本地脚本之间通信通道的设备，他们可以定义一个全局事件总线，并在本地连接或分离监听器。状态还通过模型值的插值来保存。 提前感谢大家。
collindutter
@pouyamiralayi你能详细介绍一下你是如何创建全局事件总线，在全局脚本和本地脚本之间发送消息的吗？编辑器会把 grapesjs 的内容嵌入 iframe，所以你不能用全局窗口对象作为事件总线。 谢谢！
我知道这不是硬性要求，也可以自定义，但主演示和一些克隆应用延续了这个理念，限制某些元素（输入、文本区域等）只能放在表单标签上。 这是为了证明可以做到，还是我遗漏了什么？
pouyamiralayi
我曾经有一个使用第三方组件库的用例。在该库中，输入和表单组件可用，但渲染逻辑的实现方式是，如果输入未放在表单标签中，渲染输入标签的样式将不会产生任何效果。 所以你最终会得到一个难看的输入。所以我不得不限制用户在表单标签以外的任何地方输入。举个例子，可以看看这个著名的库方法，类似于这个案例： [f7]（https://framework7.io/docs/inputs.html） 干杯。
artf
@timsim00技术上你完全可以重置这个逻辑。我之所以设置这个，是因为在HTML和CSS世界（没有JS）中，没有表单包装的输入是不合理的。 举个例子，我们以“输入”成分为例。在 'grapesjs-plugin-forms' 中，'input' 组件具有这样一个属性：'可拖拽：'form， form *'，要让它能随处拖拽，只需要这段代码 “''js 编辑。DomComponents.addType（'input'， { 型号：{ 默认值：{ 可拖拽：真 } } }) `...
我想确保每个拖入画布的组件都用列组件包裹。为此我使用Canvas Event。 首先我禁用了窗口事件，以防止默认的 HTML 5 拖放事件被触发。 “画布：投放”活动 “JavaScript ditor.on（'canvas：drop'， function （dataTransfer） { event.preventDefault（） }) 上方代码返回错误，表示dataTransfer未定义 据我了解，我们可以用“result.content”自定义投放到画布上的内容 类似 “JavaScript //... result.content = { 类型：“标题” } 我不明白的是，如何用 element/component 包裹...
afdallah
@pouyamiralayi我通过将组件作为一个对象来解决了这个问题。像这样。 “JavaScript result.content = { 标签名称：“div”， 可移除：true，// 无法移除 可拖拽：true， // 无法移动它 可复制：true， // 禁用复制/粘贴 类：['container']， 类型：“网格”， 属性：{ 标题：“这里” }， 风格：{ 颜色：“红色”}， 组件：{ 标签名称：“div”， 类别：['row']， 悬浮：错误， 可选：fal...
pouyamiralayi
你好！你要找的活动是[这个]（https://grapesjs.com/docs/api/editor.html#blocks） editor.on（'block：drag：stop'， function （element） { element.replaceWith（{ 标签Name：'div'， 样式：{'border'： '1px 实心红色'}， 组件：[元素] }) }) 注意这里我用的是红色边框的div作为我的包装;在你的情况下，是列。 干杯。
我正在做一个项目，但很难获取远程数据。 代码： storageManager： { id： 'gjs-'， // 用于参数的前缀标识符 类型：“远程”，// 存储类型 自动保存：true，// 自动存储数据 autoload：true， // Autoload 存储数据 在 init 上 stepsBeforeSave： 1， // 如果启用自动保存，表示在触发存储方法前需要多少次更改 storeComponents： true， storeStyles： true， contentTypeJson： true， urlStore：“/api/v1/templates/” + tempid， urlLoad：“/api/v1/te...
miky9585
我觉得你需要打印你的data->attributes。这是我打印出来的数据，运行良好 ![screencapture-localhost-8090-pages-load-2019-08-05-111149]（https://user-images.githubusercontent.com/17646742/62453087-e0126480-b771-11e9-95d9-2c762c10c84c.png）
jeffgipson
谢谢回复@miky9585我试过但没用
artf
@jeffgipson你从服务器退回的格式完全错误，请仔细阅读这部分 https://grapesjs.com/docs/modules/Storage.html#setup-the-server