打开新视图时扩展面板/命令示例/文档
熟悉GrapeJS的一个好习惯是尝试复制块管理器,自己创建一个。你可以通过编辑下面的文件来实现这一点。一个很好的例子是复制 src/blockmanagerand 命名为 src/sectionmanager,然后把所有名称从 BlockManager 重命名为 SectionManager。看看代码,行数不多。 然后你需要编辑以下文件才能让它正常工作: src/编辑/index.js ` SectionManager: em.get('SectionManager'), ` src/editor/model/Editor.js 然后创建一个新文件 src/commands/view/OpenSections.js src/edi...
阅读下方完整回答 ↓问题
你好,Artur,
首先,葡萄真是太棒了!
目前我正在尝试弄清楚如何创建一个带有按钮的盘状结构,这个按钮可以打开新视图,就像方块和图层管理器按钮那样。 我想在那个新视图里渲染我自己的一组物品。我看的是你用来打开那些视图的代码,但它是用管理器来渲染这些物品的。而且这些代码的作用也有些模糊。
如果能有更多关于这个主题的文献资料就太好了。
回答(3)
熟悉GrapeJS的一个好习惯是尝试复制块管理器,自己创建一个。你可以通过编辑下面的文件来实现这一点。一个很好的例子是复制 src/blockmanagerand 命名为 src/sectionmanager,然后把所有名称从 BlockManager 重命名为 SectionManager。看看代码,行数不多。 然后你需要编辑以下文件才能让它正常工作: src/编辑/index.js ` SectionManager: em.get('SectionManager'), ` src/editor/model/Editor.js 然后创建一个新文件 src/commands/view/Ope...
嘿,我也在考虑做类似的事情,发现了这里。 想知道是否有任何文档进一步解释创建新视图的过程。
你好,@RuudH谢你的建议,我希望很快能发布更多关于这个论点的内容。目前,我只能建议你检查这些面板使用的命令(例如:[开放方块](https://github.com/artf/grapesjs/blob/dev/src/commands/view/OpenBlocks.js))
相关问答
通过相似的问题讨论继续研究。
问题 #367
社区——开放集体和Discord。
大家好,Artur/大家, 我提出以下想法:开一个Discord频道或Slack(Discord正在接管),讨论与Grapej有关的非话题话题。通过[Open Collective](https://opencollective.com/grapesjs)为本项目贡献力量。我刚...
问题 #3123
功能:在样式管理器中为显示选择器添加“inline-flex”
你想给GrapesJS添加什么? 显示风格“内联弹性”。 描述: 目前,样式管理器的显示选择器只有“flex”作为选项,但与“block”和“inline-block”一样,有“inline-flex”是有用的。 当我尝试用这个(破解?)手动添加时: 我能得到结果,但有很多由“...
问题 #6458
Sector.setName 不工作
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬 可复制演示链接 https://jsfiddle.net/qbpodnm4/ 描述一下那个虫子 如何复现这个漏洞? 在画布中选择一个组件。 访问风格管理器,检查“General”是否被...
问题 #6365
样式管理器未能正确解释后裔选择器
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome 版本 131.0.6778.205 可复制演示链接 https://codesandbox.io/p/sandbox/naughty-microservice-5hp3h4 描述一下...
与此问题匹配的付费插件
根据问题关键词和标签相关性精选,助你更快交付。
正在加载付费插件推荐……
相关教程
关于同一主题的深入指南。
教程
Building an AI-Assisted Document Engine with Next.js, GrapesJS, and the AI SDK
Transform your static template editor into an intelligent, generative design workspace with Vercel AI SDK, AI Elements and Next.js.
教程
How to build a GrapesJS desktop app with Electron (complete guide 2026)
Run GrapesJS inside an Electron desktop app: mount it in the renderer, save projects to disk through IPC, and export HTML/CSS.
教程
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.
浏览插件分类
直接跳转到市场上的插件分类页面。