GrapesJS 问题

Ju99ernaut

这个插件有一个CSS网格布局工具 https://github.com/Ju99ernaut/grapesjs-plugin-toolbox https://user-images.githubusercontent.com/48953676/115495409-d98a9000-a267-11eb-923a-b6f86cbefc99.mp4

artf

@Ju99ernaut了不起的插件

GJSBlock

谢谢你举报，@rattrayalex。 关于FEAT： CSS Grid的好建议！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进行...

artf

去掉这个“const resultKey = key.slice（4）;”。你用前缀存储数据，但加载时没有

GJSBlock

谢谢你举报，@vatte21。 关于如何创建自定义存储管理器，它不会在重新加载页面后设置Canvas保存数据，这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） =>...

artf

你好@chrisijoyah你试过用'canvas：dragdata'吗？这里举个用法示例 https://jsfiddle.net/artur_arseniev/87rcb24n/

chrisijoyah

你好@chrisijoyah你试过用“canvas：dragdata”吗？这里举个用法示例 https://jsfiddle.net/artur_arseniev/87rcb24n/ 这是否意味着我可以阻止丢失的模型被添加到画布中？理想情况下，我想做一些检查，确定拖曳后的方块是否可以被放入某个区域，如果通过检测，我想在添加之前阻止它被放入。有没有办法做到这一点？我能不能做类似“result.content='' 或者类似...... “''js editor.on（'can...

artf

我能做类似result.content= ''的操作吗？ 是的，你应该能用这个技巧做到这一点。你能多说说你的使用场景吗？你想做什么样的检查？

artf

你好@Abhisheknanda1344463你试过按照我这里的指示（https://github.com/artf/grapesjs/issues/1428#issuecomment-421640559）来做吗？你不需要在每个选择中添加或移除扇区，只需调整组件属性即可

Abhisheknanda1344463

@artf我试过，但如果我喜欢这个 https://github.com/artf/grapesjs/issues/1428#issuecomment-421640559 然后它会显示这些属性存在的样式扇区。 我想像上面提到的那样，只显示我自定义的某个特定组件的样式扇区。 不知道你是否理解我的使用场景。 请指点我。 谢谢

artf

这里有一个简短的使用示例： “''js const plugin = （editor） => { const { 组件、块、样式 } = 编辑器; [ { 类型：“简单”， 道具：{ 组件：“简单组件”， }, },{ 类型：“特殊”， 道具：{ 组件：“特殊组件”， 'styleable-require'： ['special-style']， // <- 该组件需要特殊样式 }, } ].forEach（（{ type， props }） => { Components...

GoodPHP

嘿，现在它需要自己去建立。 我们已经解决了： https://gjs.market/products/pages-manager

Ju99ernaut

正在为那个 https://github.com/Ju99ernaut/grapesjs-template-manager 开发插件，虽然还在开发中，但现在状态相当不错。

echobinod

使用VueJS的多页面管理器： https://github.com/echobinod/GrapesJS-Vue.js.git

artf

“''js blockManager： { 附录：'#blocks'，// <- 删除此项 ```

GJSBlock

谢谢你举报，@joshk132。 无法让方块显示在右侧边栏的问题似乎是竞速状态或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别根本原因 在报告...

Ju99ernaut

“''js window.editor = grapesjs.init（{ // ... 选择经理：{ componentFirst： 1， } // ... }); ```

ahmedderkaoui

非常感谢！

GJSBlock

谢谢你举报，@ahmedderkaoui。 关于样式管理器能否总是生成ID，而不是使用已定义的元素类？，这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => con...

GoodPHP

是的，每卖插件20%我们会派人支持GrapesJS。 如果你买插件，你会支持 GrapesJS。

theSC0RP

@GoodPHP 这是付费插件吗？

GJSBlock

谢谢你举报，@GoodPHP。 关于Ckeditor5 + GrapesJS现在可以实现！的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'somet...

bgrand-ch

你好， 对于未来的问题或技术问题（非漏洞），GitHub的[讨论]（https://github.com/artf/grapesjs/discussions）标签是最佳选择。 如果问题已解决，请关闭，或在[讨论]（https://github.com/artf/grapesjs/discussions）->[问答]（https://github.com/artf/grapesjs/discussions/categories/q-a）类别写一条详细的新消息（并关闭本期）。...

anlumo

是的，如果你有任何互动内容，那可能行不通。幸运的是，我的申请情况并非如此。

Ju99ernaut

也许你可以在服务器端安装Grapesjs（类似客户端），用来渲染，否则你得逆向工程渲染器。另一种选择是将生成的HTML也存储在数据库中。

GJSBlock

谢谢你举报，@YumiChen。 网页组件槽中排序器方向错误的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别根本原因 在报...