#32962021年3月1日作者 RaresVlaiduc3 个回答
你好! 我看到这里有人讨论过某种多页插件。 这还存在吗?有没有什么办法解决这个问题,还是我应该自己开插件? 谢谢!
Ju99ernaut
我做了一个简单的 indexedDB,但它也可以适配到其他存储类型 https://github.com/Ju99ernaut/grapesjs-indexeddb-ui 不过我打算弃用它,改用一个内置其他存储类型的新插件,并且界面和用户体验也更好。我计划在artf在#3206号提到的“PageManager”API发布后发布它,同时可能还有同期提到的其他插件正在开发中。
artf
是的,还在进行中(很遗憾我还没到),但PageManager肯定会放在核心里。
ClaudeCode
谢谢你举报,@RaresVlaiduc。 关于[问题]:多页插件的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something changed'...
#32952021年3月1日作者 marcepoblet4 个回答
版本: v0.16.41 你能重现演示中的bug吗? [ ] 是的 [ ] 不 预期的行为是什么? 当我们有一个属性为 data-gjs-draggable 的 false 按钮时,这个按钮不应在画布中被拖动。 详细描述那个漏洞 步骤将带有可拖拽属性的按钮组件设置为 false将按钮拖入其他组件内拖动按钮 目前的行为是什么? 步骤将带有可拖拽属性的按钮组件设置为 false将按钮拖入其他组件内按钮不应拖动 你能附上截图、截屏或实时演示吗?** [ ] 是的(附上视频) https://user-images.githubusercontent.com/64096863/109490335-da245880-7a66-11eb-81...
artf
我猜你做错了什么,你是怎么创建这些组件及其属性的?你甚至不应该在检查员里看到这些属性。
marcepoblet
@artf 我们的准则中没有做任何更改。唯一的区别是我们更新了GrapesJs的版本。 之前我用的是v0.16.18版本,运行正常,但现在我们把GrapesJs更新到v0.16.41后,按钮功能就不行了。
marcepoblet
我们用以下方式设置属性: editor.getSelected().attributes.attributes[“data-gjs-editable”] = 'false' editor.getSelected().attributes.attributes[“data-gjs-copyable”] = 'false' editor.getSelected().attributes.attributes[“data-gjs-droppable”] = 'false' edi...
#32942021年2月27日作者 server1024 个回答
你好, 我怎样才能在属性列表中添加buildProps,使得当选择某个选项时,该选项的属性会显示出来 这是我在flex属性上想要实现的目标示例。 “JavaScript { 名称:“布局”, 开启:真, buildProps: ['display'], 性质:[ { 类型:“无线电”, 属性:“显示”, 列表:[ { 标题:“区块”, 名称:'<span class=“material-icons”>calendarviewday</span>', 值:“方块”, }, { 标题:“Flex”, 名称:'<span 类=“material-icons”>calendarviewweek</span>', 值:“flex”, bui...
Ju99ernaut
我相信你可以把构建道具从属性列表中移出,仍然能实现你想要的功能,内置的Flex Box相关属性只有在组件带有“display: flex”时才会显示。还需要注意的是,“buildProps”只是输入的预设,不能嵌入到其他输入中,也就是属性列表 “''js { 名称:“布局”, 开启:真, buildProps: ['display', 'direct', 'align-content', 'align-items', 'align-items', 'align-self',...
server102
谢谢。我试过了,但网格属性不起作用。可能得手动实现,但不确定怎么最好地处理这个问题。
Ju99ernaut
网格属性没有“buildProps”,所以你得从头开始构建,遗憾的是文档里关于自定义属性的信息不多,你可能得从API参考里拼凑起来 https://grapesjs.com/docs/api/style_manager.html#stylemanager
#32932021年2月26日作者 eikerd2 个回答
我有一份类别清单,想根据是否需要用不同风格标记一些类别。 理想情况下,我可以在 div 里添加一个类,类为 'GJS-title',这样它就会显示为'gjs-title required-field' 'this.editor.BlockManager.getCategories();' 返回了我所有块类别的数组,但我的问题是,我该如何选择一个来使用 .addClass() ? 如果我按“id”来判断,并且我把 ' this.editor.BlockManager.get('logos').addClass('required-field')' 这似乎不起作用。 选择 gis 块类别的 DIV 以实现 .addClass() 的最...
artf
你好@eikerd通过查看代码,目前我看不到其他方法可以自定义块类DOM,除非你自己用DOM做点什么(块渲染完成后)。 我可能会在下一个版本中把视图添加到分类模型中,所以你可以这样做: “''js const blockCat = 编辑器。Blocks.getCategories().filter(c => c.get('id') == 'ID-CAT')[0].view; blockCat.el.addClass('add-class'); ```
ClaudeCode
谢谢你举报,@eikerd。 关于Blockmanager:添加自定义类gjs-block-category / gjs-title DIVs,这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on...
#32922021年2月26日作者 sudiptochoudhury3 个回答
非常感谢你提供这个图书馆。 背景:我正在构建一个编辑器,打算从我之前开发并在应用中使用的现有Vuejs组件中定义大部分组件。这些大多是基于界面的简单和复杂组件。例如,我有简单的 vuejs 组件,分别叫 su-form、su-field、su-label、su-input、su-radios、su-buttons、su-validations,以及使用简单组件如 su-login-form、su-registration-form 等的复杂 vuejs 组件。正如你可能猜到的,su-form、su-field 以及其他类似组件都有插槽,我会添加其他组件,以创建一个具有业务用例的实用组件。例如,我会在 su-form 的插槽中插入...
Ju99ernaut
我不确定每个组件是否都有这样的钩子,但你可以尝试利用组件的“toHtml”属性。这个问题已经在别处讨论过了,所以你可以在期刊中搜索,因为有不少。
artf
是的,你可以用自定义的“toHTML”/“toJSON”函数(模型中)来定义组件,以便自定义它们的输出
ClaudeCode
感谢你报告,@sudiptochoudhury。 存档前每个组件是否存在一个事件,组件可以监听?的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)—...
#32912021年2月25日作者 marcepoblet4 个回答
版本: v0.16.41 你能重现演示中的bug吗? [ ] 是的 预期的行为是什么? 重复的元素不应该影响原元素的变化。 详细描述那个漏洞 步骤:选择元素(文本、图片等)点击工具栏中的复制图标修改新重复的元素原始元素也被修改 https://user-images.githubusercontent.com/64096863/109187944-27f04680-7771-11eb-8ba4-1181ed56b08f.mp4 目前的行为是什么? 当某些元素被复制,且被复制的元素被修改时,原始元素也会被修改。 你能附上截图、截屏或实时演示吗?** [ ] 是的(附上了视频)
artf
谢谢大家的反馈,我知道这个bug,开发版已经修复了。我完全忘了发布它😬,我会尽量今天发布
devtechk
@artf 非常感谢!你帮我省了很多功夫 _ 我整个下午都在调试这个问题......顺便说一句,我查了npm,发现0.16.44版本已经不行了...... 你救了人。非常感谢!捐款,你值得拥有一切!❤️
aadilmehrajbhat
自“”葡萄“以来的回归问题:”0.16.34“'
#32902021年2月25日作者 marcepoblet3 个回答
版本: v0.16.41 你能重现演示中的bug吗? [ ] 不 预期的行为是什么? 当我们撤销图片时,changesCount参数应重置为零 详细描述那个漏洞 步骤:添加图片删除图片撤销更改 我们应该看到 changesCount 参数应该被重置为零。 目前的行为是什么? changesCount参数是递增的,而不是0。 你能附上截图、截屏或实时演示吗?** [ ] 是的(附上了视频) https://user-images.githubusercontent.com/64096863/109162404-ee124680-7756-11eb-9668-b1909b913831.mp4
GayathriGuru
嗨!@marcepoblet你能分享一下你用来定义 changesCount 变量以实现递增的代码部分吗?
artf
我就结束这段,因为我看不出这个功能有什么实质性的好处
ClaudeCode
谢谢你举报,@marcepoblet。 撤销图像时,changesCount参数应重置为零的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有...
#32892021年2月23日作者 bgrand-ch4 个回答
版本: 0.16.41 你能重现演示中的bug吗? [X] 是的 [ ] 不 预期的行为是什么? 1)将选中的父组件(容器)复制到剪贴板。 2)从剪贴板中选定的父组件(容器)粘贴到同一页面或其他页面。 3)所有组件都保留ID样式和内联样式。 目前的行为是什么? 1)将选中的父组件(容器)复制到剪贴板。 2)从剪贴板中选定的父组件(容器)粘贴到同一页面或其他页面。 3)组件失去了ID样式,但内联样式未丢失。 组件没有重新生成的样式ID,而是使用相同的之前ID,但带有“-2”。 你能附上截图、截屏或实时演示吗? [X] 是的(附上) [ ] 不 https://jsfiddle.net/bgrandch/71yuz26p/33/ 根据...
artf
那是因为你用你的版本更新了原始命令(错误地)。确实,如果我把你的插件从演示中移除,一切都会正常运行。请检查原始的复制粘贴命令,你应该在粘贴前克隆组件,所以你的实现可能无法正常工作。
artf
只要检查原始命令 https://github.com/artf/grapesjs/blob/dev/src/commands/view/CopyComponent.js https://github.com/artf/grapesjs/blob/dev/src/commands/view/PasteComponent.js
bgrand-ch
@artf 谢谢你的回答。请提供链接、示例或更多解释?😅
#32882021年2月23日作者 ilsantuzzo2 个回答
我发现克隆和所有克隆组件都有镜像编辑功能。有没有办法避免这种情况? 
artf
我今天应该能发布修复😬方案 https://github.com/artf/grapesjs/issues/3291
ClaudeCode
谢谢你举报,@ilsantuzzo。 关于编辑克隆而不影响克隆组件的好问题。推荐的组件方法是使用事件驱动的API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something changed')); 组件...
#32872021年2月23日作者 RaresVlaiduc4 个回答
首先,祝贺@artf完成了这个了不起的项目 💯 我目前正在做一个项目,想问一下是否可以像编辑里面其他组件那样编辑包装器(主体)。 例如,我想像编辑背景色一样编辑包装的填充部分。  我看过配置,但没找到有用的信息。 谢谢! LE:我找到了方法。我正在覆盖getWrapper()中的可样式数组,但我不确定这是不是正确的方法。你能确认吗?
artf
是的,@kuhelbeher,现在封装器是在插件后创建的,所以你可以像扩展其他组件一样完全扩展它
artf
LE:我找到了方法。我正在覆盖getWrapper()中的可样式数组,但我不确定这是不是正确的方法。你能确认吗? 是的,当然没问题,但如果需要,可以通过“mainConfig.domComponents.wrapper”选项在init时更改包装器属性 https://github.com/artf/grapesjs/blob/18b2f95b7f844578dc2b28d786b126013d155d9e/src/dom_components/config/config.j...
kuhelbeher
你可以通过“mainConfig.domComponents.wrapper”选项在init时更改包装器属性https://github.com/artf/grapesjs/blob/18b2f95b7f844578dc2b28d786b126013d155d9e/src/dom_components/config/config.js#L9 你好,我注意到这些选项是针对旧版本的 Grapesjs,但在新版本中 domComponents 配置中,封装属性被移除了。有没有办法...