编辑者未订阅选择器:移除
你好,@BenKhz之所以这样,是因为“selector*”事件与全局Selectors容器有关(当你从组件中移除选择器时,Selector本身仍然存在,因为它可以在其他地方使用),如果你想跟踪组件选择器的变化,必须使用'component:update:classes'事件
阅读下方完整回答 ↓问题
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome v115.0.5790.170可复制演示链接 https://jsfiddle.net/BenKhz/yfwqc6mu/1/ 参考[这里的文档](https://grapesjs.com/docs/api/selector_manager.html#available-events)描述一下那个虫子开放式提供的小提琴 [此处](https://jsfiddle.net/BenKhz/yfwqc6mu/1/)在 Canvas 上选择一个组件,并通过选择器管理器添加类。(“添加”和“更新”事件将被捕获)从类管理器中移除一个类'editor.on('selector', () =>{})' 的事件监听器无法执行。 预期的行为是什么? 预计移除类会触发“selector:remove”事件 目前的行为是什么? Editor.on 没有看到任何关于选择器管理器的移除事件。参考文档,catch-all事件“选择器”只看到“add”和“update”,但从未看到“remov”事件。 我可能误解了这些活动的目的;如果有,能否给我澄清一下,或者找个变通办法?当某个特定类被移除时,我试图在所有组件上触发自定义行为。 感谢你们所有的付出。真是个很棒的项目!🚀行为准则[X] 我同意遵守本项目的行为准则
回答(3)
你好,@BenKhz之所以这样,是因为“selector*”事件与全局Selectors容器有关(当你从组件中移除选择器时,Selector本身仍然存在,因为它可以在其他地方使用),如果你想跟踪组件选择器的变化,必须使用'component:update:classes'事件
啊!我误会了。谢谢你的澄清。继续加油!
谢谢你举报,@BenKhz。 编辑器未订阅selector:remove的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因 在报告中包含 GrapesJS 版本、浏览器和控制台错误
相关问答
通过相似的问题讨论继续研究。
问题 #5280
视图中的事件处理程序未绑定到组件
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome 版本 115.0.5790.114 可复制演示链接 https://jsfiddle.net/mcraf3se/5/ 描述一下那个虫子 你好,我刚开始用GrapesJS,所以很可能我...
问题 #4356
选择器:移除事件不存在
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? 铬101 可复制演示链接 https://jsfiddle.net/sdrf72wx/1/ 描述一下那个虫子 如何复现这个漏洞?在编辑器初始化时执行以下代码添加和移除组件的选择器查看控制台输出 预...
问题 #5705
编辑器大小调整时组件工具会出现错位
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome v122 可复制演示链接 https://jsfiddle.net/Lk2bwhp4/ 描述一下那个虫子 如何复现这个漏洞?将编辑器放入容器中,然后通过程序调整容器的宽度。 预期的行...
问题 #3703
自定义ID在CSS中注入\3,\3后面有空格,\3后面有空格
警告 请阅读并遵循接下来的三步,然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下,看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答,否则问题可...
与此问题匹配的付费插件
根据问题关键词和标签相关性精选,助你更快交付。
正在加载付费插件推荐……
相关教程
关于同一主题的深入指南。
教程
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.
浏览插件分类
直接跳转到市场上的插件分类页面。