PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。 获取抢先体验
已收录 3,464 个 GitHub 问题 — 370 个已解决 · 90 个待解决 搜索、筛选并探索经过实战检验的答案。
找到 3,464 个问题
我有个问题，希望有人能帮忙。 我想做一个特性，让我在选择某个 div 的 div 时可以选择预定义的颜色。有人能帮我，如何简单地实现这个目标吗？
artf
你可以用一个简单的选择特性类型和颜色列表，并在颜色更改后更新它的样式。 这里有所有与你案件相关的例子：https://grapesjs.com/docs/modules/Traits.html
GJSBlock
谢谢你举报，@ikenderham。 关于问题：选择某个类或分元素时预定义的背景色，这是个很好的问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'some...
大家好，我正在通过 grapesjs 创建一个文档生成器，我想在每页底部插入类似“第1页共5页”这样的页码。我的起始模板有一个叫.page的封装类，实际上我可以把一个页面克隆到另一个页面下面，从而获得更多页面。 你知道我该如何实现这个功能吗？ 谢谢！
devtechk
大家好！我找到了实现目标的方法！CSS 的属性！ 这是我的工作代码（你可以随意调用分页标签）。 来源：https://www.pagedmedia.org/paged-js/ HTML： ' <页码类=“text-right 页码”>页 </pagination> ` CSS
GJSBlock
谢谢你举报，@devtechk。 关于生成页码，有什么建议吗？虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进行细致跟踪 构建一个插...
@artf 你好，我不确定你是否理解我的问题。 我想在我自己的 js 编辑器里编辑 js 代码，首先我用 'getJs（'） 从你的编辑器里设置了 js 代码，但你demo.html里看起来是这样的： ![1444126130]（https://user-images.githubusercontent.com/23135336/112428513-3b91cb80-8d76-11eb-91de-ce51a8500203.jpg） 这些代码都是压缩的。我想要像这样一个未压缩的代码，格式为[https://github.com/Ju99ernaut/grapesjs-script-editor]（URL） ![1811563111]...
GJSBlock
谢谢你举报，@xinnai。 关于压缩的getJ's问题，这是个很好的问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed...
![图片]（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...
I need to reload "https://.../main.js" every time I add a block,what should I do？
artf
订阅你认为可能有用的[事件]（https://grapesjs.com/docs/api/editor.html#available-events），然后按意愿重新加载
GJSBlock
谢谢你举报，@sizhousama。 关于[问题]我每次添加一个方块时都需要重新加载“https：//.../main.js”，这是个很好的问题，我该怎么办？。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'cha...
有没有办法修改已编译状态的模板？ 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
谢谢，但我一直在找一种方法把内容注入我自己的模态里。 很多库都有模态模板文件或变量来实现这一点。
我正在尝试扩展“预览”命令。 我本以为下面的代码会运行正常的预览命令和控制台输出，但实际上只有控制台语句能运行。 我怎样才能保留原始预览代码？ 以下内容对我来说还算有效，直到有人能指出我哪里出了问题。
artf
如果你指定了一个新的“run（）”函数，命令只会运行新的，否则就无法完全更改命令（这里更多内容是关于[扩展命令]（https://grapesjs.com/docs/modules/Commands.html#extending））
ronaldohoch
你好，Artf，奇怪的是，我也需要和他一样的东西。 所以，最好的做法就是模仿他？在扩展预览中运行原始预览命令？
ronaldohoch
嗯...... 我还在做的另一件事是通过在事件上运行命令来扩展预览。 “''js editor.on（“run：preview”，（）=>{console.log（“run-preview”）}）; editor.on（“stop：preview”，（）=>{console.log（“stop-preview”）}）; ```
你好@artf 我想知道为什么图层的名称范围会有一个“contenteditable”属性。 如果我没记错的话，grapesJs 上并没有实现任何机制，可以在刷新页面后真正更改图层名称。 这对用户来说可能会有点困惑。 '''html <div class=“gjs-layer-title-inn”> <i class=“gjs-layer-caret fa fa-chevron-right” data-toggle-open=“”></i> <span class=“gjs-layer-name gjs-no-app gjs-layer-name--no-edit” data-name=“ contenteditable=”tru...
artf
如果你双击图层名称，实际上可以更改它的名字:)
Franci5co5aoco
@artf，抱歉，我觉得我被误解了。 我的意思是你可以更改名称，但刷新页面时更改内容不会被保存......我认为并没有实施任何机制来实现这一点。 当用户修改图层名称时，他期望该修改会被保存，但事实并非如此。 这里有一段用官方GrapesJs演示的视频： 我把'Header'图层的名称改成了'Test'，刷新页面时'Header'还是保留了图层的名称。这是预期中的行为吗？ 如果有，为什么它有“内容编辑”属性？ 非常感谢你的时间。 https://user-images.git...
artf
不，存储/加载自定义图层名称的机制是存在的，唯一的问题是更改没有触发存储......确实，如果你在更改后立即尝试移动某个组件，页面刷新后你会看到它们。 无论如何，这个问题应该会在即将推出的页面管理器模块中得到修复。
警告 请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 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...