GrapesJS 问题

有没有办法在选定默认值 Float、Position 和 text-align 时移除交叉 svg

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？版本 111.0.5563.147（官方构建）（64位）可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子如何复现这个漏洞？这是你可以查看的图片链接 https://ibb.co/0Qg7nTK 预期的行为是什么？点击默认值时，叉图标应该会被移除;如果选择float值为零，那么十字图标应该会显示non 目前的行为是什么？当前行为的十字图标在选择默认值时不会被移除行为准则 [X] 我同意遵守本项目的行为准则

artf

@Spiral1234默认值和定义值之间有很大区别（即使默认值和默认值相同）。比如在桌面端你定义了“float： right”，在移动端定义“float： none”，你仍然需要在移动端上移除“ne”这个值。

abubaker417

@artf，让我再给你定义一次。我的问题是，如果我点击任何模块的默认值，比如float，我选择“none”，那么“cross svg”应该是“display： none”，就像我对其他模块“position”、“text-align”的设置一样。如果有人选择默认值，那么在即将重置的“交叉SVG”上方应标注为“显示：无”。我截图里提到了重置的跨SVG，默认值应该是“display： none”。谢谢

artf

@Spiral1234选择默认值时不应该是“显示：无”，请仔细阅读上述使用场景，默认值和选择默认值是不同的。

#50122023年3月27日作者 Hunganh30121 个回答

0 个反应

提问常规

我不知道为什么我在select-image标签里加了src属性，但它在GrapesJs的“viewcode”部分里没有出现

Em ở Việt nam（我来自越南）我希望能得到帮助。链接GitHub：https://github.com/GrapesJS/grapesjs/discussions/5011

GJS Helper

听起来你在GrapesJS中处理自定义组件时遇到了一个常见问题，特别是关于属性的定义和序列化。src属性虽然是<img>标签的标准配置，但除非你明确定义，否则select-imageGrapesJS不会自动识别或序列化。根本原因 GrapesJS中的“视图代码”部分（或 HTML 输出）是基于组件的内部模型生成的。当你创建自定义组件（例如 <select-image>），GrapesJS本身并不了解它应该拥有哪些属性，也不知道该如何处理它们。如果像 src 这样的属性在自...

#50062023年3月24日作者 sandipshirawala2 个回答

0 个反应

Grapejs 中的 aphostrope 问题——显示时从 HTML 字符串显示时没有显示

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome v91 可复制演示链接 https://jsfiddle.net/szLp8h4n 描述一下那个虫子 $html = str_replace（“ ' ”， \' “，$html）; 行为准则 [X] 我同意遵守本项目的行为准则

artf

提供一个有效且可复现的演示链接，而不是用作模板的那个

GJSBlock

谢谢你举报，@sandipshirawala。 Grapejs 中 aphostrope 问题——显示 html 字符串时未显示，似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：如果还没测试过，请用最新的GrapesJS版本测试提供最小可重复的示例...

#49672023年3月9日作者 wyxcoder3 个回答

0 个反应

New storage doesn't work

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？铬可复制演示链接 https://jsfiddle.net/1vknjLst/ 描述一下那个虫子如何复现这个漏洞？点击运行预期的行为是什么？应该会在新存储中读取并保存，控制台应该显示“正在加载中” 目前的行为是什么？什么都没发生如果需要执行某些代码以重现该漏洞，请将其粘贴到下面：行为准则 [X] 我同意遵守本项目的行为准则

artf

你必须使用插件 'plugins： [dbStoragePlugin， 'gjs-blocks-basic']'使用“autosave： false”时，你是在禁用自动保存，这意味着只有在程序调用（例如“editor.store（）”）时，“Storage.store”才会被触发。没有“setStepsBeforeSave”选项，只有“stepsBeforeSave”

wyxcoder

谢谢你！这样很好用

GJSBlock

谢谢你举报，@wyxcoder。关于新存储不工作的好问题。GrapesJS 推荐的方法是使用事件驱动 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something changed'））; 组件生...

#49212023年2月8日作者 ghost3 个回答

0 个反应

[X] 我确认使用最新版本 GrapesJS

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？ Chrome 版本 110.0.5481.78（官方构建）（64 位）可复制演示链接 https://grapesjs.com/demo.html 描述一下那个虫子如何复现这个漏洞？用 npm 或 CDN 安装 GrapesJs ，并像往常一样初始化为容器，例如 ID 为 div #something..在控制台上，检查verbose level是否设置为激活。设置完毕，页面加载完成后。刷新页面并注意控制台日志。预期的行为是什么？嗯，冗长的信息应该被修正。目前的行为是什么？目前显示了60多条冗长的信息。 ![截图 2023-02...

artf

结尾，因为这与核心无关，而是针对[演示页面]（https://github.com/GrapesJS/grapesjs/blob/gh-pages/demo.html），如果你想屏蔽这些警告，请先发布PR

ghost

这和核心版不是演示版页面有关，因为我用演示页做了插画

GJSBlock

谢谢你举报，@ghost。关于*的好问题。GrapesJS 推荐的方法是使用事件驱动 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something changed'））; 组件生命周期 edit...

#48652023年1月24日作者 agreif2 个回答

0 个反应

'@' 登录 class-attribute 块内容的值，在使用模板文字时将 '-' 符号更改为

GrapesJS版本[X] 我确认使用最新版本GrapesJS你用的是什么浏览器？ Firefox 108.0.2可复制演示链接在JSfiddle里不行描述一下那个虫子 grapesjs-cli - 3.0.1 grapesjs - 0.20.3 如何复现这个漏洞？添加一个带有@符号的 class 属性的 newblock，该模板为字面量将木块拖入工作区将创建以下div元素：其他繁殖可能性：用工具打开代码Import将class属性改为包含@符号。保存它。然后当你回放Import Template对话时，@符号会被-符号取代问题：请看第一div的class...... 预期的行为是什么？属性值不应改变，因此应保持@符号：...

artf

我会更新逃脱功能，目前你可以通过[此选项]（https://github.com/artf/grapesjs/blob/f08b5afe6f79626e734de330fbff3c30824c04a9/src/selector_manager/config/config.ts#L27-L32）提供自己的。

GJSBlock

谢谢你举报，@agreif。关于使用模板文字时，类别属性值将块块内容改为“-”符号的好问题。GrapesJS 推荐的方法是使用事件驱动 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'somethin...

#48172023年1月2日作者 sdimitrenco2 个回答

0 个反应

如果 div 内部有标签 p >的 span，就无法在 div 内部编辑文本节点。

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ Chrome 版本 108.0.5359.125，Mozilla 107.0可复制演示链接 https://jsfiddle.net/stanislavdimitrenko/d61cm4yg/14/描述一下那个虫子所以， grapes js. 如果你有那个结构体 “某些没有包装的文本”——你不能编辑那段文字。 Grapes 不能编辑...... 如果改变了这一点，那你就可以。或者，如果你给文本加装，同样可以编辑。也许需要设定剧本工作 grapesjs 或限制？行为准则[X] 我同意遵守本项目的行为准则

artf

是的，目前这是解析文本节点没有适当封装和文本组件作为兄弟节点的预期行为。所以为了让这些节点可编辑，你必须正确地用类似标签的范围包裹它们。

GJSBlock

谢谢你举报，@sdimitrenco。如果 div 在 page p > span 内有标签，无法在 div 内编辑文本节点的问题，似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：** 如果还没测试过，请用最新的GrapesJS版本测试提供最小可重...

#47992022年12月23日作者 AgnRakul2 个回答

0 个反应

Issues on setDragMode in version 0.20.2

GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器？铬可复制演示链接 https://jsfiddle.net/6c7xw3Lu/2/ 描述一下那个虫子 [截屏时间：2022-12-12 12：24：15 IST.webm]（https://user-images.githubusercontent.com/70213104/209287702-270827d7-57f3-4501-a89b-8b3d51cba2b2.webm）版本0.20.2的拖拽模式问题，视频中无法看到拖拽，请检查一次行为准则 [X] 我同意遵守本项目的行为准则

artf

这与[本期]（https://github.com/artf/grapesjs/issues/4792）相关，且已准备好下一次发布。

GJSBlock

感谢你报告，@AgnRakul。 0.20.2版本中Issue的setDragMode问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：* 如果还没测试过，请用最新的GrapesJS版本测试提供最小可重复的示例（CodeSandbox）——这有助于...

#47842022年12月14日作者 phamthanhbinh47963 个回答

0 个反应

Bug resize image

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器？ 108.0.5359.73可复制演示链接 https://user-images.githubusercontent.com/44830209/56891735-89203380-6a8e-11e9-8d42-c530d5aa0ae2.gif描述一下那个虫子错误调整图像大小嗨！我在调整图片大小时遇到了一些问题。当我放置图片并点击一个调整尺寸的处理程序时，图片不会保持高度，而是扩展到父容器的100%...... 可调整大小：1 作为背景，图像有一个绝对位置。谢谢大家的帮助！行为准则[X] 我同意遵守本项目的行为准则

MrRainDrop9x

我也有同样的问题，有人能帮帮我们吗？

artf

我建议所有与绝对模式相关的bug请参考[本问题]（https://github.com/artf/grapesjs/issues/3770）。

GJSBlock

谢谢你举报，@phamthanhbinh4796。错误调整图像大小的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。尝试什么：添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤：如果还没测试过，请用最新的GrapesJS版本测试提供最小可重复的示例（CodeSandbox）——这有助于团队更快识别根本原...

#47002022年10月31日作者 Aar-if2 个回答

0 个反应

常规

Add images to Asset Manager

谢谢

artf

这不是bug，你只需要刷新AssetManager的资产（'editor.Assets.clear（）.add（newAssets）'），因为编辑器很可能已经加载完成。

GJSBlock

感谢你举报，@Aar-if。感谢你分享关于向资产管理器添加图片的报告。为了帮助团队调查并优先排序：请提供：一个最小可复现的例子（CodeSandbox/JSFiddle）你的GrapesJS版本号浏览器和操作系统信息浏览器控制台的任何错误信息重现问题的步骤最有帮助的是什么：简约代码示例（不是你整个项目）屏幕录制或截图显示问题明确区分预期行为与实际行为你正在使用的GrapesJS配置有了这些细节，维护者可以更快地识别和优先排序修复。GrapesJS团...