PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。 获取抢先体验
已收录 3,464 个 GitHub 问题 — 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。
找到 3,464 个问题
嘿，@artf我通过 NPM 安装了 grapes JS[ “grapesjs”： “^0.15.9”]，我用的是 Vue 和 grapes JS，这是我的代码 ------------------------------------------------------------------------------------------------------------ import grapesjs from 'grapesjs';import 'grapesjs/dist/css/grapes.min.css';export default { data（） { return { 编辑：null } }, 方法：{ ch...
pouyamiralayi
@raghuv9 为 Grapesjs 创建自定义 Vue 组件： 并且实际使用它： 更多信息请查看此 [repo]（https://github.com/magr0s/vue-grapesjs）。 干杯！
我遇到了一个问题，要替换一个元件在相同位置（上/左），新元件总是被添加到顶部：0px / 左：0px; 我正在考虑类似这样的内容： “''js const selectedComponent = editor.getSelected（）; const coll = selectedComponent.collection; const at = coll.indexOf（selectedComponent）; var styles = selectedComponent.getStyle（） ||{}; coll.remove（selectedComponent）; let newComponent = coll.add（comp...
artf
代码大致上看起来还行，务必检查“styles”包含位置属性（组件也有绝对位置）。如果还没用，请尝试制作一个可复现的演示
大家好， 我刚接触 grapejs ，JS也稍微新手。 我必须实现的目标 => 我必须在iframe中显示我正在加载预览的容器 => 块部分应在主页的ioframe之外，我会在iframe内拖放块。 我遇到的问题 =>如果我在iframe里添加init容器，并尝试用block管理器在主页添加块部分，它确实在做。但当我尝试把块放到iframe的容器里时，它就不行了。 如果我把方块放在iframe内部，效果也是一样。 希望我的解释足够让你理解问题所在。 请帮帮我。 提前感谢大家。
pouyamiralayi
@Atmiya735看看这个[fiddle]（https://codepen.io/artf/full/MQpZPj），它用自定义布局来做方块部分。 干杯！
Atmiya735
谢谢你的帮助，但我想在iframe里实现容器部分，在iframe之外实现方块部分，同时还想实现拖拽功能。 请帮帮我
pouyamiralayi
@Atmiya735如果你注意到提供的小提琴里方块部分在iframe之外。 干杯！
你好， 我正在尝试实现多个页面。对于多个页面，我想在所有页面之间共享页眉和页脚以保持一致性，所以我认为做法是分别保存它们。这可能吗？有什么建议吗？
hellocaio
我的想法是： const html = $（editor.getHtml（））; const header = html.find（“header”）.html（）; const footer = html.find（“footer”）.html（）; 但我不喜欢我用jQuery 这件事 ：/....有什么解决办法吗？
artf
我不确定这样分离它们是否合适。最好的做法可能是用类似“符号”来保持组件同步，但 GrapesJS 还没有实现。 目前，我建议先单独处理这些组件（页眉/页脚），然后再在页面中添加（比如 https://github.com/artf/grapesjs/issues/2061#issuecomment-501476210 或 https://jsfiddle.net/5vcc3en6/）。
比如我有一个组件图像，它包裹在 div 里。 我想为图片做包含多个属性（水平位置、边界半径等）的样式 更新水平位置时，需要更新当前元素 - div 当更新边界半径时，需要更新子元素——img。 另外，我用Trait遇到了很大问题，无法更新IMG的src。 我在 Trait 加了 listener，变更时给 img 应用值，然后 div 和 img 把 src 一起用，但这不是个好办法。 导出默认值（编辑器）=> { 编辑。TraitManager.addType（'image'， { onEvent（{ elInput， component， event }） { component.view.el.querySelector（'...
pouyamiralayi
@obrazkow 你可以这样访问父节点：“component.parent（）;” 对于子节点：“const collection = component.components（）;”我对 Trait 有个很大问题，无法更新 img 的 src。 干杯！
pouyamiralayi
用你的解特质，不知道src值和输入在初始化编辑器阶段会是空的。 我不明白你在说什么！你怎么看我用初始化方法覆盖目标的解决方案 你用高级解决方案处理了一个非常简单的用例，我个人不建议为这种情况定义自定义特征。 干杯！
obrazkow
@pouyamiralayi 我就是这么做的，但用这种解决方案，选中的组件只需属性或样式，只需子组件。
我用编辑器生成一个HTML字符串并保存成文件。但在保存之前，我必须编码所有的 & < > 字符。 请帮帮我
pouyamiralayi
@suchiitsme 干杯！
artf
在下一个版本中，我们将避免使用HTML字符 https://github.com/artf/grapesjs/pull/2446
我试着在你的演示中复现这个问题，但没成功，但现在遇到了最奇怪的问题。 我希望你能在调试时指点我正确的方向。 一旦我把html存到localStorage并刷新页面（你会看到屏幕录制中短暂停顿），grapesjs会神奇地在HTML中的每个ID上加上“-2”。请看下面的屏幕播放： ![grapesjsaddingdash]（https://user-images.githubusercontent.com/31323376/71123555-ca895e80-2197-11ea-8419-66cae61e3e01.gif） 你能想到这可能出现在你的代码中哪里吗？为什么？我该如何避免这种情况？ 谢谢@artf
artf
只有在你附加包含已定义 ID 的 HTML 时才会发生，所以编辑器会递增它以避免冲突。 你确定不会重复添加相同内容吗？！ 无论如何，进行检查的函数在这里： https://github.com/artf/grapesjs/blob/dev/src/domcomponents/model/Component.js#L1262 这里用的是（添加新内容时）： https://github.com/artf/grapesjs/blob/dev/src/domcomponents/m...
artf
你用的是最新版本吗？
kickbk
@artf，是的，我有。0.15.9，虽然之前的版本也是一样。我尝试移除所有插件以保持系统非常干净，但只要生成localStorage，仍然会出现这个问题。有人知道为什么或者在哪里生成这个功能以便我调试吗？
我有个问题。当 CSS 属性添加到 StyleManager 配置中时，例如我添加了颜色并将默认值设为绿色（仅供测试）： '名称：'排版'， 开场：假， buildProps： ['color']， properties：[{ name： 'font color'， property： 'color'， default： “green”}， ...' 看起来它不会影响新添加方块的文字颜色？我把文本块放到画布上——文字颜色是黑色的。当我打开样式管理器面板时，我看到那个颜色被设置为绿色。我尝试的其他属性（宽度、高度）也是一样。
artf
你好@angyLe风格管理器只是以一种“盲路”的方式构建属性，其中一些属性并不直接影响目标（组件/规则）。在这种情况下，“默认值”更像是一个提示，提醒用户该属性没有价值。因此，从实际角度看，你必须按照CSS规范来构建属性，而让它们不同其实并不太合理。
angyLe
我不想让属性在规格上有所不同。我只是想为已有的属性设置默认值。比如我希望文本框的宽度是100px，所以当它添加到画布时，宽度是100px。我以为可以在StyleManager里设置属性的默认值“宽度”来配置。但看起来这不会影响添加到画布上的方框宽度。 还是我做错了什么？我该如何实现这个目标？
balchen
@artf抱歉，我没听懂你的回答（@angyLe和我一起在系统中实施 grapesjs ，所以我知道问题是什么）。 当我读到你的回答时，我理解你的意思是： 1）属性的默认值不会立即应用于新的组件实例 2）属性的默认值在样式管理器中显示，仿佛已经应用到组件上，即使实际上没有 这听起来不太对，所以我觉得我没理解你的回答，或者你是基于不同的理解来回答这个问题。 我非常想详细说明我们应该如何使用默认值，以及如果使用默认值 grapesjs 会这样表现。 问题的背景是关于 dragm...
我用的是Bellow版本。 “Grapesjs”： “^0.14.62”， “grapesjs-preset-newsletter”： “^0.2.20”， 相信这些是NPM中最新的版本。我遇到了未定义的错误。 你之前的帖子里说版本是错误的，但我相信我的版本是最新的。
pouyamiralayi
@chezhiane你没有使用[最新版本]（https://grapesjs.com/docs/#download） 干杯！
我正在使用 这方法有效，但仅适用于初始化后手动添加或拖放到编辑器中的方块。如果我们在调用 'grapesjs.init（{...， components： [..]}）时提供'components''，定义在“components”中的分量不具备这些特征。我们如何对最初加载的组件也应用特征，而不仅仅是对后来手动添加的组件？
artf
目前除非在插件中定义自定义类型，否则存储自定义类型时存在问题。 没问题😬，你只需要在内容之前加载自定义类型，使用插件是唯一的办法我无法将所有可能的插件元素添加 https://jsfiddle.net/artur_arseniev/9tg0a36c/
varadero
以下是可以复制的方法：去 https://jsfiddle.net/nwsy6mv1/3/打开积木并放置“1列”方块点击列内，进入“设置”你会看到带有标签“Trait label”的下拉式特征此时， grapesjs 组件被保存在本地存储中，因为该存储被配置为 storageManager: { type: 'local' }刷新浏览器，使 grapesjs 从本地存储加载组件点击该列，进入“设置” 发生了什么： 设置面板现在只包含默认属性，而不是代码中指定的。现在如果你手...
pouyamiralayi
你好@varadero请把你的自定义类型定义为插件。 干杯！