#63762025年1月18日作者 Harshsne261 个回答
GrapesJS 版本 [x] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://codepen.io/Harshsne/pen/ZYzjaYe 描述一下那个虫子 预期的行为是什么？ 当最小值设为1时，边框宽度应从1开始递增。 目前的行为是什么？ 但边界宽度的值默认设置为0。（如果是这种情况，可以做什么，将默认值设为“”，并且当我递增时，值应从1开始。） 行为准则 [x] 我同意遵守本项目的行为准则
GJS Helper
你遇到的 min 值不影响 border-width 0 初始显示的问题是常见的混淆点。GrapesJS 风格管理器中的 min 属性主要影响步进/滑块控制和验证，防止值低于指定最小值。它本身并不决定样式属性的初始值或默认值“，尤其是当该属性浏览器默认值为 0（比如 border-width）。 让我们拆解实现你期望行为的解决方案。 根本原因 当组件被添加到画布时，其样式最初是空的。随后应用浏览器的默认样式，意味着border-width实际上会被0（或medium，在许多...
#63742025年1月17日作者 Harshsne262 个回答
GrapesJS 版本 [x] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://codepen.io/Harshsne/pen/gbYjOWO 描述一下那个虫子 如何复现这个漏洞？ 我已经在单击下调用了 onactive，这样我就能在一键内编辑文本框。 光标应该放在我点击的位置，这也是双击事件中发生的情况（双击变成单点击时预期的效果）。 预期的行为是什么？ ...光标应该放在我点击的位置 目前的行为是什么？ ...光标指向文本框的起始位置 ![图片]（https://github.com/user-attachments/assets/3eccac92-94e7-4004-8034-...
mohamedsalem401
嘿，我检查过你的代码并尝试调试。在我看来，代码没有把鼠标事件传递给 onActive 方法，而 onActive 是必须的： “''js componentEl.addEventListener（'click'， （ev） => { component.view.onActive（ev）; });
GJS Helper
谢谢你举报，@Harshsne26。 关于光标位置错误的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））; 组...
#63732025年1月16日作者 ChipiKaf2 个回答
GrapesJS 版本 [x] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 版本 131.0.6778.265 可复制演示链接 https://codepen.io/chipikaf/pen/KwPexjL 描述一下那个虫子 如何复现这个漏洞？ 将按钮组件放在中间部分 将按钮在该区域任意移动 元素调整大小 预期的行为是什么？ 将元素调整到其原始位置 目前的行为是什么？ 该元件被移到一个意想不到的位置 行为准则 [x] 我同意遵守本项目的行为准则
ChipiKaf
@artf我本地有解决办法。基本上我会检查元素是否有相对位置的父元素，然后如果存在且位置相对，则将矩形体偏移为父节点的高度。 如果可以的话，我可以帮它创建一个永久纪录？
GJSBlock
谢谢你举报，@ChipiKaf。 关于在启用绝对拖拽时，子节点调整大小时在父位置中出现了错误元素，但相对位置是错误的，这个问题很棒。推荐的组件方法是使用事件驱动的API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.l...
#63692025年1月14日作者 hubermat2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome v130 可复制演示链接 https://grapesjs.com/demo-newsletter-editor.html 描述一下那个虫子 如何复现这个漏洞？在编辑器中选择任意元素在样式部分，前往边界半径 预期的行为是什么？ 四个角落的边界半径设置显示如下： 左上右上 左下至右 目前的行为是什么？ 底部角落的边框半径设置互换了： 左上右上 右下-左下 <img width=“217” alt=“Bildschirmfoto 2025-01-14 um 11 47 36” src=“https://github.com/use...
DarrenHou1993
这个改动解决了界面问题，但也带来了数值问题。设置左下角半径时，实际上是修改了右下角。
GJS Helper
你提到的 GrapesJS 风格管理器中 border-bottom-left-radius 和 border-bottom-right-radius 显示顺序互换的问题，是旧版 GrapesJS 或特定演示设置默认配置中的已知异常。你已经正确观察到 GrapesJS Studio 已经解决了这个问题，表明新设置或自定义实现中配置已修正。 根本原因 GrapesJS 风格管理器通过结构化配置定义 CSS 属性，包括像 border-radius这样的复合属性。border-...
#63652025年1月8日作者 MLMarxx4 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome 版本 131.0.6778.205 可复制演示链接 https://codesandbox.io/p/sandbox/naughty-microservice-5hp3h4 描述一下那个虫子 如何重现该漏洞：将 dark-style 类添加到正文中： js editor.CssComposer.addRules(".dark-style .test-block { margin-top: 50px; }"); 预期行为是什么： 在样式管理器中解释为margin-top： 50px; 当前行为如何： 在样式管理器中没有显示，但在...
artf
是的，这不支持，因为试图匹配任何可能的规则可能会影响性能。 不过你可以通过 [styleManager.select]（https://grapesjs.com/docs/api/style_manager.html#select） 选择任意规则。
MLMarxx
好的，谢谢你的澄清——我现在用的是select，有什么办法用这种方式定位媒体标签吗？
artf
你可以获取你需要的CSSRule（['getRule']（https://grapesjs.com/docs/api/css_composer.html#getrule）），然后传给styleManager.select
#63582024年12月19日作者 rhoenerSBS2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome v131 可复制演示链接 https://jsfiddle.net/0uaxn2vc/2/ 描述一下那个虫子 如何复现这个漏洞？打开小提琴链接选择可以添加组件的主体或其他组件尝试只通过点击方块添加组件，不要拖放以前能用，但现在即使在 BlockManager 配置里用 appendOnClick： true 也不能了 预期的行为是什么？ 组件应仅点击添加 目前的行为是什么？ 控制台错误：“BlockView.ts：58 未捕获类型错误：c.setDropContent 不是函数”，组件未被添加行为准则 [X] 我同意遵守本项目...
artf
感谢@rhoenerSBS问题已修复，[这里]（https://github.com/GrapesJS/grapesjs/pull/6346），并将在下一个版本中提供。
GJS Helper
GrapesJS的 BlockManager 中的appendOnClick选项在最近版本中确实坏了，导致了Uncaught TypeError: c.setDropContent is not a function错误。这个问题源于BlockView在启用appendOnClick时点击事件处理方式的变化。 根本原因 在GrapesJS中，当用appendOnClick: true点击一个方块时，BlockView尝试模拟一个掉落动作。它试图调用目标组件（错误信息中的c）...
#63572024年12月13日作者 Harshsne261 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://codepen.io/Harshsne/pen/YPKwRBg 描述一下那个虫子 如何复现这个漏洞？从 blockmanager 添加行组件。在样式管理器中更改其宽度。（！重要性是因为默认宽度是100% ！important）。现在添加文本框，改变其宽度。 预期的行为是什么？ 宽度不应加上！important。 目前的行为是什么？ 宽度加上了！important。 在更改行宽度后，如果我们更改画布中任意组件的宽度，宽度会被添加为 ！importance 。 ![20]（https://github.com...
GJSBlock
谢谢你举报，@Harshsne26。 关于！重要性会被添加到每个组件样式，这个问题非常好。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'some...
#63542024年12月13日作者 RakulAgn2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://grapesjs.com/演示 描述一下那个虫子 如何复现这个漏洞？直接访问画布尚未渲染的演示网站 Grapesjs 预期的行为是什么？ 画布应该被渲染 目前的行为是什么？ 未捕获的类型错误：无法设置空属性（设置为“_isEditor”） 画布上的空白行为准则 [X] 我同意遵守本项目的行为准则
artf
关闭了这个，演示看起来运行正常，可能是浏览器缓存或扩展出了问题
GJS Helper
Uncaught TypeError: Cannot set properties of null (setting 'isEditor')错误，尤其是在GrapesJS演示网站上出现空白画布时，表明编辑器初始化过程中发生了关键故障。该错误意味着GrapesJS正在尝试在预期存在但目前null的对象或DOM元素上设置内部属性（isEditor）。 根本原因分析 在GrapesJS的语境中，_isEditor属性常用于内部标记编辑器UI或核心结构中的元素（例如主容器、面板等）...
#63482024年12月7日作者 Frubl2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ 铬 可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子 如何复现这个漏洞？尝试选择，比如整个侧边栏工具/文本/所有功能抓取并放置在画布上 预期的行为是什么？ 可能只复制粘贴文本或净化过的 html，或者可以拖拽只放我做成可删除的元素 目前的行为是什么？ 我可以拖拽Canvas里的任何东西。 ![Screenshot_14]（https://github.com/user-attachments/assets/11627411-14e5-4fda-a202-c6921cf64047） 行为准则 [x...
artf
你可以通过“canvas：dragdata”事件控制画布中丢失的内容 https://jsfiddle.net/artur_arseniev/87rcb24n/
GJS Helper
你报告的问题是， GrapesJS 画布外的任意元素（包括编辑器界面的部分）可以拖拽到画布中，这是浏览器原生拖放功能导致的常见行为。默认情况下，浏览器允许拖放大多数可选内容或元素。 GrapesJS的画布作为标准HTML元素，继承了这种行为。 根本原因： 当你拖动元素时，浏览器会为 DataTransfer 对象填充各种数据类型（例如， text/plain， text/html）。如果 GrapesJS 没有明确拦截并阻止这些 dragover 和 drop 不需要内容的...
#63452024年12月6日作者 VanTranTrucPhuong2 个回答
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome 版本 131.0.6778.109（官方构建）（64 位） 可复制演示链接 https://grapesjs.com/demo-newsletter-editor 描述一下那个虫子 如何复现这个漏洞？将鼠标指针放在你想选择文本的起始位置。按住SHIFT键。将鼠标指针移动到文本选择的目标端点。 预期的行为是什么？ 所选文本应自动带有高亮背景，表示已被选中。 目前的行为是什么？ 所选文本没有高亮的背景。 行为准则 [X] 我同意遵守本项目的行为准则
sirbeagle
我认为我查明原因在于无法同时选择多个方块。评论 “''t” this.clearSelection（this.Canvas.getWindow（））; ``` 在 [/src/editor/model/Editor.ts]（https://github.com/GrapesJS/grapesjs/blob/46b3292a9682f77076ddebe6015cfa247a55a844/packages/core/src/editor/model/Editor.ts#L53...
GJS Helper
你遇到了一个常见问题：GrapesJS富文本编辑器（RTE）中的文本选择不会直观高亮所选文本，尽管选择本身是可行的（例如，你可以复制文本）。这种行为在官方演示中是可复现的，并表示存在样式冲突。 根本原因 该错误的根本原因通常与CSS有关。浏览器使用::selection伪元素来为所选文本进行样式化（例如应用蓝色背景）。在像网页构建器这样带有富文本编辑器（GrapesJS使用 ProseMirror 作为 RTE）的复杂环境中，自定义 CSS、全局重置或特定编辑器配置可能会无...