带有指针事件的组件:'all'(除封装器外)或可编辑组件可以拖拽并下放到自己身上。
问题
葡萄JS版本
- 我确认使用最新版本的GrapesJS
你用的是什么浏览器?
Chrome 107.0.5304.121(官方版本)(arm64)
可复制演示链接
https://jsfiddle.net/artur_arseniev/aku70f5w
描述一下那个虫子
如何复现这个漏洞?
- 尝试拖拽可编辑组件或本身带有“指针事件:全部”CSS的组件。它会消失的。由于该操作执行无限循环,并在控制台上返回错误“未捕获范围错误:最大调用堆栈大小已超过”。即使将可拖拽的 false 设置为可编辑组件,它依然可以拖拽。
预期的行为是什么? 可编辑组件不应该像包装组件一样被拖拽到自己。
目前的行为是什么? 可编辑组件可以拖拽到自己。即使设置为可拖拽假(false)也是如此。
行为准则
- 我同意遵守本项目的行为准则
回答(3)
演示本身有个问题,现在已经修复了(在包装组件中添加了“可拖拽:false”)
getCSSS补丁让它始终返回可编辑组件的内容无法正常工作,你能帮我解决这个问题吗@artf 下面的代码(包含在可复现演示链接中)总是返回整个画布或包装器的CSS字符串。
editor.getModel().getCss = () => {
const wrapper = editor.getWrapper();
const cmp = wrapper.findType('editable')[0];
退回CMP吗?编辑。CodeManager.getCode(cmp, 'css') : '';
};
谢谢你举报,@FaisalShaikhHA。 关于带指针事件的组件:“全部”(除了包装器)或可编辑组件可以拖拽到自己身上,这个问题很棒。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始: 查看你所在模块的[GrapesJS文档](https://grapesjs.com/docs/) 寻找“on()”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式: “JavaScript 留意变化 editor.on('change', () => console.log('something changed')); 组件生命周期 editor.on('c...
相关问答
通过相似的问题讨论继续研究。
问题 #6659
符号样式未同步
GrapesJS版本 [x] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Firefox 145.0(64位) 可复制演示链接 https://jsfiddle.net/arturarseniev/ta19s6go/ 描述一下那个虫子 如何复现这个漏洞? 进入官...
问题 #3972
不能在Noscript标签里丢掉IMG
葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Brave Versão 1.32.106 Chromium: 96.0.4664.45 (Versão oficial) 64 bits 可复制演示链接 https://jsfiddle.net...
问题 #3131
将纯文本粘贴到文本组件中,会为粘贴的文本添加 <font /> 封装器
版本: 0.16.27 你能重现演示中的bug吗? [] 是的 [X] 不 预期的行为是什么? 将粘贴文本为纯文本(文本节点),不像Grapes JS在</>元素中进行打包。 目前的行为是什么? 当我把纯文本粘贴到空文本元素时,编辑器会用<font />元素包裹它。 在粘贴文本...
问题 #3397
分拣器方向与网页组件槽不符
版本:0.16.45 你能重现演示中的这个bug吗?[x] 是的[ ] 不 预期的行为是什么? 给定一个父网页组件实例渲染一些元素,在 shadowDOM 中,如果 'slot' 的父元素具有 'display: flex' 风格,排序器应是垂直的,因为结果中元素是水平对齐的。...
与此问题匹配的付费插件
根据问题关键词和标签相关性精选,助你更快交付。
正在加载付费插件推荐……
相关教程
关于同一主题的深入指南。
教程
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.
浏览插件分类
直接跳转到市场上的插件分类页面。