GrapesJS 问题

artf

#2130的复制品

artf

GrapesJS没有页面的概念，它只是一个画布，如何处理取决于你

giorgiosjames

去掉表单，只用JavaScript来创建/接口模态内容效果很好。'modal.setContent（）'用于附加按钮，'myButton.onclick = （） => {}' 用于捕捉点击事件。 这里有一些示例代码： “''es6 函数 openModal（） { const pfx = editor.getConfig（）.stylePrefix; const modal = 编辑器。模态; const container = document.createElemen...

artf

这里的重点是，“内容”接受HTML节点（不仅仅是HTML字符串），所以你可以拥有任何带有事件的HTMLElement（表单带提交，按钮带点击等），所以提出的方法完全有效（谢谢@giorgiosjames）

AkibDeraiya123

@giorgiosjames 谢谢，兄弟，这（https://github.com/artf/grapesjs/issues/2129#issuecomment-510734779）对我来说简直是完美无缺。 你的回答帮我省下了很多时间:)

artf

请查看[DeviceManager API]（https://grapesjs.com/docs/api/device_manager.html） 目前只能使用一个条件（可以通过“mainConfigObject.mediaCondition”选项配置，默认为“max-width”）

Ensaphelon

@artf 有什么原因为什么 Grapesjs 仍然不支持这个功能？看起来只要在“EditorConfig”中移除“mediaCondition”选项，并允许在“widthMedia”字段中为每个设备传递任何媒体查询即可解决。 目前这个功能对我来说至关重要，有没有办法修改结果CSS？我看到有个选项可以传递自定义CSS解析器，但与媒体查询相关的样式缺失了。

artf

首先，把所有道具从方块移到组件上，这样可以实现： “''js blockManager.add（'条形图-块'， { ... 内容：{ 类型：'canvas-options' } })

artf

哪个 IE？

ghost

哪个IE？ 比如11岁。

artf

为什么在编辑器画布上，视频组件的 parent tag （video） 里有 div，而当我拿到 html（editor.getHtml（））时，div 却不存在 要让组件以特定方式表现，它的视图（你在画布中看到的）可以完全不同，所以完全没问题 如果我想再添加一个 div 作为父，>可能吗？（代表Stye CSS） 如上所述，你可以更新“视频”视图，使用或添加任何你想要的内容

giorgiosjames

看起来画布和图层管理器中组件的显示名称是该块的类型ID，首字母大写。 据我所知，唯一能改变的方法是创建一个新类型，扩展旧的类型，使用不同的ID，然后删除旧类型以保持整洁。然后，所有使用旧类型的区块都需要更改为新类型，标签也要更改。 这里有一些示例代码，正在更改一些默认组件名称： “''es6 editor.on（'load'， （） => { const translateObject = { '文本'：'翻译文本'， 'image'： 'translatedImage'，...

artf

你可以这样更新他们的名字。 重要提示：否则把代码放进插件里，否则你可能会看到只有新添加组件时才会看到更新的名称 “''js 编辑。DomComponents.addType（'image'， { 型号：{ 默认值：{ 名称：“我的形象”， } } }); ```

lajby95

谢谢。在添加新组件时，这个方法很有效，但比如我用editor.setComponents（html）加载一个预设html+css，然后再开始编辑它，预设的HTML标签会自动分配GrapesJS赋予各种组件名称（文本、框、图片等）。 我该如何编辑这些默认名称？我似乎找不到办法。

zyxnowell

我刚刚弄明白了，你只需要在“init”方法中声明你的自定义JS，并将“allowSripts”设置为true。