PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。 获取抢先体验
已收录 3,464 个 GitHub 问题 — 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。
找到 545 个问题
🔍 typescript你好，当我用“shift”多选某些元素，并在styleManager中更改样式时。只有最后点击的元素才会更新样式。你能帮我解决这个问题吗？ https://user-images.githubusercontent.com/23135336/113699004-9d075200-9707-11eb-893c-9b3734e2d0b3.mov
Ju99ernaut
不确定有没有这个选项，风格管理器可能还没有实现多组件编辑功能。你可以用类作为替代方案。
artf
它在演示中实际上是有效的，你能制作一个可复现的演示吗？
no-response[bot]
由于我们请求原作者提供更多信息未获回应，本期已自动关闭。仅凭当前期刊中的信息，我们没有足够的信息采取行动。如果您有答案或找到我们需要的答案，请随时联系我们，以便我们进一步调查。
我想添加一个特征的指示。 我的组件有以下特性： 对于类型“dateformat-indication”，我创建了以下类型： 然而，即使它不在模板里，我还是会收到我创建的输入： ![git]（https://user-images.githubusercontent.com/58575867/113580735-07dc5e80-961e-11eb-8c6d-a24052984d05.png） 有没有办法禁用该特质的默认输入？
ahmedderkaoui
使用以下方法效果很好：
GJSBlock
谢谢你举报，@ahmedderkaoui。 关于FEAT：在不输入的情况下添加指征作为特质的好问题。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something ch...
![截图（11）]（https://user-images.githubusercontent.com/57554308/113369015-1a505280-9315-11eb-8d48-c9b8bdef335e.png）警告 请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下，看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答，否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 http...
Ju99ernaut
grapesjs 和 grapedrop 是两个独立项目，你应该在这里提出你的问题 https://spectrum.chat/grapedrop
GJSBlock
谢谢你举报，@Squirrel1489。 在免费版本下无法添加超过两个项目的问题似乎是竞争条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别...
版本： 0.16.45 你能重现演示中的bug吗？[ ] 是的[x] 不 预期的行为是什么？ 不应该有空文本。 目前的行为是什么？ 在将数据保存到数据库并检索（参见附带组件对象）后，空数据会出现。 这就是我分配来自数据库组件的方式 “''js this.editor = grapesjs.init（{ 容器：“#gjs${this._uid}'， 插件：[类型]， fromElement： false， 高度：这个。高度， 宽度：“自动” storageManager： false， 资产管理人：{ 资产：this.assets， 上传文件：this.uploadFile }, noticeOnUnload： false， com...
artf
看起来是你这边的问题，因为我无法复现（也许你后台操作有误？！）。先尝试创建一个可复现的演示（通过使用localStorage）
GJSBlock
谢谢你举报，@dluague。 保存后*无文本的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别根本原因 在报告中包含 Gr...
版本：0.16.45 如果我添加 grapejs-preset-js，stylemanager 会重复每个选项两次。 这里有个 jsfiddle 链接，你可以检查相同的行为。 [https://jsfiddle.net/assadnazar/2asojqrc/1/]（https://jsfiddle.net/assadnazar/2asojqrc/1/） 也许是选项没有合并
Ju99ernaut
用途： “''js window.editor = grapesjs.init（{ // ... styleManager： { clearProperties：1 }, // ... }); ```
assadnazar
砰！
GJSBlock
谢谢你举报，@assadnazar。 感谢你分享关于StyleManager选项重复两次的报告。为了帮助团队调查并优先排序： 请提供： 一个最小可复现的例子（CodeSandbox/JSFiddle） 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么： 简约代码示例（不是你整个项目） 屏幕录制或截图显示问题 明确区分预期行为与实际行为 你正在使用的GrapesJS配置 有了这些细节，维护者可以更快地识别和优先排序...
大家好， 首先，我想表达对这个惊人工具的感激之情。我基于文本组件做了扩展按钮组件，这样可以手动编辑按钮内容，而不使用特质。 扩展按钮组件的代码如下： var comps = 编辑器。主导组件; var defaultType4 = comps.getType（'text'）; 编辑。DomComponents.addType（'button'， { 模型：{ 默认值：{ 标签名称：“button”， 类：['.pointer']，//悬停时添加点击指针， }, }, 扩展：“文本”， isComponent： 函数 （el） { 如果 （el.tagName === 'BUTTON'） 返回 {type： 'button'}; }...
artf
看起来空格会触发 Chrome 中的“点击”事件。解决办法似乎是在“keypress”时添加 preventDefault https://stackoverflow.com/questions/22104860/chrome-firing-onclick-when-space-typed-in-contenteditable-button 附言：避免那样扩大视野。默认情况下，当你使用某种类型的“extend”时，它也在扩展视图（如果你需要扩展另一个组件的视图，可以用“ex...
GJSBlock
谢谢你举报，@christosapos。 关于无法基于文本组件添加扩展按钮组件空格的好问题。。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something chang...
![图片]（https://user-images.githubusercontent.com/33087222/112741199-0a074300-8fb6-11eb-83e9-aa665b9291d3.png） 例如： 我在编辑器外面加了左边栏和上边栏。我知道颜色选择器的位置是相对于身体的，所以是否可以在配置中添加关联偏移？那我可以加一个-40来让选色器调到正确的位置吗？
artf
你应该能通过这种方式定义颜色选择选项 “''js Grapesjs.init（{ colorPicker： { ... } }); ``` 这里您可以查看所有[可用选项]（https://github.com/artf/grapesjs/blob/86ce053309235c2a0a8bed9d9ded4326e82310df/src/utils/ColorPicker.js#L11）
skru
在 .init（） 之后，可以访问 colorPicker 吗？ 我想动态更新托盘
GJSBlock
谢谢你举报，@jcsofts。 关于FEAT：是否可以为颜色选择器添加相对偏移，这是个很棒的问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'someth...
有没有办法修改已编译状态的模板？ https://github.com/artf/grapesjs/blob/d3256e621bb43a537213ffcd86b10dc0bd0bd070c0b/src/modal_dialog/view/ModalView.js#L1-L16 如果没有，从我们的CMS中将标题和内容插入模态骨架中，最简洁的做法是什么，以获得更紧凑的视觉和感觉？我意识到这样做会失去 grapesjs 模态开闭事件。
artf
现在可以替换模态 https://grapesjs.com/docs/modules/Modal.html#custom-modal
Ju99ernaut
这里有一份使用内置模态的插件列表，希望对你有帮助： https://github.com/artf/grapesjs-tui-image-editor https://github.com/artf/grapesjs-custom-code https://github.com/Ju99ernaut/grapesjs-template-manager https://github.com/Ju99ernaut/grapesjs-script-editor https://g...
kerryj89
谢谢，但我一直在找一种方法把内容注入我自己的模态里。 很多库都有模态模板文件或变量来实现这一点。
警告 请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下，看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答，否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 你想给GrapesJS添加什么？ 详细描述你的功能需求详细 最新版本有替代方案吗？[ ] 是的（描述替代方案）[ ] 不 这是否与某个问题有关？[ ] 是的（请...
NagarRahul
@artf ![图片]（https://user-images.githubusercontent.com/42827466/112465042-40607a80-8d8a-11eb-828c-a0e88ca7e113.png） 我拖动按钮时，它就是消耗。我想修复它。拖动新按钮时不应该消耗。溢出后会滚动鞋卷。
artf
这主要取决于组件的样式（比如用Display Inline-Block来控制那个按钮可能会解决这个问题）
GJSBlock
谢谢你举报，@NagarRahul。 关于FEAT：@How在容器内拖拽元素时，固定容器大小，容器会根据子拖拽元素被消耗。我们如何根据父容器自动调整子元素大小。容器不应根据子元素来消耗。应该是展示卷轴。！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector...
我正在尝试用 set 函数来更改组件的内容，但实际上结果是一个空组件，内部什么都没有。 这是一个代码总结的示例 使用版本：0.16.44 预期的行为是什么？ 执行的代码应生成一个包含文本“foo”的组件。 目前的行为是什么？ 执行后的代码会清空组件内容。 在0.16.34版本中，一切正常运行。 这个问题有解决办法吗，还是我应该继续用0.16.34版本？
artf
你不应该使用“content”属性，应该用“selectedComponent.components（str）”。
GJSBlock
谢谢你举报，@nairdapuiu。 关于Set content function清空组件内容，这个问题很棒。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'somethi...