#34062021年4月20日作者 vatte212 个回答
大家好,我想把 Canvas 上的数据保存到 Redux 存储,这样可以,但重新加载页面后,存储加载方法没有把我的数据设置为构建器(Canvas),我不知道问题出在哪里,如果有人有解决办法请告诉我。 代码示例: “''js Grapejs.init({ .../// storageManager: { 类型:“redux-storage”, 自动保存:错误, 自动装填:1, }, .../// }); const reduxStorage = {}; const storageManager = editor.StorageManager; storageManager.add('redux-storage', { load(ke...
artf
去掉这个“const resultKey = key.slice(4);”。你用前缀存储数据,但加载时没有
ClaudeCode
谢谢你举报,@vatte21。 关于如何创建自定义存储管理器,它不会在重新加载页面后设置Canvas保存数据,这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () =>...
#34052021年4月20日作者 chrisijoyah4 个回答
警告 请阅读并遵循接下来的三步,然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下,看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答,否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 你想给GrapesJS添加什么? 详细描述你的功能需求详细 目前有一个事件可以连接到“canvas:drop”,可以访问掉落的模型。在将方块放入画布之前,我想先...
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= ''的操作吗? 是的,你应该能用这个技巧做到这一点。你能多说说你的使用场景吗?你想做什么样的检查?
#34042021年4月18日作者 Abhisheknanda13444634 个回答
你好@artf我想隐藏和显示特定组件的样式属性。 提到这个问题后,我就说 https://github.com/artf/grapesjs/issues/1428 我用这个方法写代码,但出现了错误 -: “''js 导出默认值(编辑器,配置)=> { const sm = 编辑。风格经理; const csm = config.customStyleManager; 形状分隔时的展示风格 editor.on('component:selected', function(component) { if(component.attributes.type == 'shape-divider') { sm.addSector('styl...
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...
#34032021年4月14日作者 John-Oula4 个回答
我如何创建多个页面?
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
#34022021年4月14日作者 joshk1322 个回答
版本: 0.14.62 你能重现演示中的bug吗?[ ] 是的[x] 不 不支持Vue.js或NPM 预期的行为是什么? 在风格管理器右侧边栏显示的块 详细描述那个漏洞 我正在尝试让块管理器显示在右侧边栏,但无论我把块 div 放在哪里,它总是放在侧边栏外面,即使我把它放在样式管理器/容器正下方。 目前的行为是什么? 它会显示在 #gjs div的上方或下方 你能附上截图、截屏或实时演示吗?**[x] 是(附上)[ ] 不 https://imgur.com/a/ca8Lzf8 代码来自App.vue Package.json
artf
“''js blockManager: { 附录:'#blocks',// <- 删除此项 ```
ClaudeCode
谢谢你举报,@joshk132。 无法让方块显示在右侧边栏的问题似乎是竞速状态或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因 在报告...
#34012021年4月12日作者 ahmedderkaoui3 个回答
当我们在编辑器中为元素做样式时,如果该元素既没有类也没有ID,样式管理器会生成一个带有CSS样式的新ID。然而,用类样式化元素时,样式管理器会用该类添加样式。 有没有办法总是用ID来做样式,而不用类? (这有助于用户在具有相同类别属性的组件上创建不同的自定义样式)
Ju99ernaut
“''js window.editor = grapesjs.init({ // ... 选择经理:{ componentFirst: 1, } // ... }); ```
ClaudeCode
谢谢你举报,@ahmedderkaoui。 关于样式管理器能否总是生成ID,而不是使用已定义的元素类?,这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => con...
#34002021年4月12日作者 GoodPHP3 个回答
我们是[DevFuture](https://devfuture.pro/grapesjs-development/),开发了集成GrapesJS + ckeditor5的插件。 视频示例: https://www.youtube.com/watch?v=xn4gSMIrx-A 我们认识很多人很久以来都在寻找这种集成。我们做到了。 如果你对这个插件感兴趣,请联系我们的联系人。 更多细节: https://devfuture.pro/grapesjs-development/ 谢谢!
GoodPHP
是的,每卖插件20%我们会派人支持GrapesJS。 如果你买插件,你会支持 GrapesJS。
theSC0RP
@GoodPHP 这是付费插件吗?
ClaudeCode
谢谢你举报,@GoodPHP。 关于Ckeditor5 + GrapesJS现在可以实现!的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('somet...
#33992021年4月9日作者 AdamTorma4 个回答
首先,感谢@artf这个了不起的项目。 我有个问题: 在服务器端(Node.js环境)能否轻松地将组件的JSON转换为HTML?如果可能的话,能给我一些建议吗? 客户端方面很简单: 我可以获取components-JSON (“JSON.stringify(editor.getComponents();')”)并保存到我的数据库。之后我可以重复使用组件('editor.setComponents();'),并让 HTML ('editor.getHtml();') 在浏览器中显示。不过就我而言,我必须在服务器端完成。 任何帮助都将不胜感激!
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也存储在数据库中。
#33972021年4月9日作者 YumiChen1 个回答
版本:0.16.45 你能重现演示中的这个bug吗?[x] 是的[ ] 不 预期的行为是什么? 给定一个父网页组件实例渲染一些元素,在 shadowDOM 中,如果 'slot' 的父元素具有 'display: flex' 风格,排序器应是垂直的,因为结果中元素是水平对齐的。 目前的行为是什么? 分拣器会是水平的。 你能附上截图、截屏或实时演示吗?[x] 是(附上)[ ] 不 https://jsfiddle.net/72dyhu6L/ <img width=“741” alt=“截圖 2021-04-09 下午6 38 06” src=“https://user-images.githubusercontent.com/276...
ClaudeCode
谢谢你举报,@YumiChen。 网页组件槽中排序器方向错误的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因 在报...
#33962021年4月9日作者 YumiChen1 个回答
版本:0.16.45 你能重现演示中的这个bug吗?[x] 是的[ ] 不 预期的行为是什么? 给定一个父元素,其样式为“display: flex”和“flex-direction: column”,子元素的样式为“float: left”,排序器应为水平排列,因为结果中元素是垂直对齐的。 目前的行为是什么? 分拣器会是竖式的。 你能附上截图、截屏或实时演示吗?[x] 是(附上)[ ] 不 https://jsfiddle.net/fzb4u7rd/ <img width=“741” alt=“截圖 2021-04-09 下午6 18 38” src=“https://user-images.githubusercontent....
ClaudeCode
谢谢你举报,@YumiChen。 flex-direction: column 和 float: left: 使排序器方向错误的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示...