我该如何指定丢弃元素的位置？
把标题块放进画布后，我需要它放在任何其他组件/块的顶部。目前，我正在这样做。但这并没有奏效。 editor.on（'canvas：drop'，（DataTransfer， model）=> { 如果 （model.is（'头部'））） { VAR指数 = 0; editor.getComponents（）.add（model， {at： index}）; } })
阅读下方完整回答 ↓问题
我想指定拖拽元素的位置。比如，如果我有一个标题块，无论你拖到哪里，它都应该放在文档顶部。我该怎么做？
回答（4）
把标题块放进画布后，我需要它放在任何其他组件/块的顶部。目前，我正在这样做。但这并没有奏效。
editor.on（'canvas：drop'，（DataTransfer， model）=> { 如果 （model.is（'头部'））） { VAR指数 = 0; editor.getComponents（）.add（model， {at： index}）; } })
你可以用“可拖拽”属性（通过CSS查询字符串）定义组件可以放置的位置，但不能指定位置。 你可以尝试创建一个自定义组件作为容器，存放像 header 这样的组件，并且始终用这些容器初始化你的模板。然后你的头部可以用以下方式使用可拖拽属性：'draggable： '[data-gjs-type=“header-container”]'，'，
@artf谢谢你的回复。我不知道这是不是正确的方法，但我做了一件事，对我有效。我对这方面还很新，还在从文档中学习。 我做了这个—— editor.on（'canvas：drop'，（ model）=> { if （model.is（'header'）） { //created custom component type header const wrapper = editor.getWrapper（）; const el = wrapper.find（'header'）[1]; 检查是否已经存在头部 if（el==未定义）{ var 包装子 = 编辑器。DomComponents.getC...
谢谢你举报，@RutujaBadbe。 关于我如何指定丢弃元素的位置？的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））; 组件生命周期 editor.on（'component：mount'， （c） => console.lo...
相关问答
通过相似的问题讨论继续研究。
问题 #3303
类别顺序显示不正确
嗨！ 我想在区块管理器中按特定顺序显示这些类别。我查阅了文档和之前的问题，发现了订单属性。于是，我尝试设置了顺序属性。但即使 ORDER 属性正在设置，它还没有按那个顺序显示。我是不是漏掉了什么？或者做错了什么？ 我正在做的是： 因此，期望的结果是按顺序查看类别——标题、旋转木...
问题 #3141
加载动态内容
如果之前有人讨论过，我真的很抱歉。我已经搜索过相关问题，也仔细阅读了文档，也许我理解得不对。 我知道你可以在页面构建器里运行脚本加载内容，但当我点击保存后，内容/HTML会被保存吗？这意味着前端会加载过时的内容或HTML吗？ 你能指点我去更深入理解这一点，并且让内容始终通过 a...
问题 #3400
Ckeditor5 + GrapesJS 现在可以实现了！
我们是[DevFuture]（https://devfuture.pro/grapesjs-development/），开发了集成GrapesJS + ckeditor5的插件。 视频示例： https://www.youtube.com/watch?v=xn4gSMIrx-A...
问题 #3544
性格按钮命令在0.17.4版本中无法使用
版本：0.17.4 带有类型按钮的特性在0.17.4版本中无法调用命令，而命令在0.17.3之前是用来工作的。预期行为 点击特质中定义的按钮调用命令。发生了什么 点击按钮没有任何作用jsfiddle 示例 命令在 0.17.3 -> https://jsfiddle.net/7...
与此问题匹配的付费插件
根据问题关键词和标签相关性精选，助你更快交付。
正在加载付费插件推荐……
相关教程
关于同一主题的深入指南。
教程
GrapesJS DevTools: A Developer Panel Inside Your Editor
If you've ever debugged GrapesJS with console.log(editor.getSelected()) and a dozen throwaway event listeners — this post is for you.
教程
How to Build a Production GrapesJS Editor: The Complete Walkthrough of Brief, Preset, Plugins, and Services
A complete walkthrough of building a production GrapesJS editor: how to choose a preset, pick plugins, and scope setup services without burning a sprint.
教程
Big Updates: TinyMCE 8 and Placeholder 2.0 for GrapesJS
In May we shipped major updates to two of our most popular GrapesJS plugins — TinyMCE Inline Text Editor and Placeholder.
浏览插件分类
直接跳转到市场上的插件分类页面。