GrapesJS 问题

artf

感谢@rmadeiraneto的报告。是的，不幸的是，如果你以这种方式变异数组/对象属性，这就是个问题，为了避免这种情况，你有两个选择：避免直接变异（更新时分配新引用）将“默认值”定义为函数 “''js 默认值： （） => （{ customArray： [1,2,3] }）， ``` 但不幸的是......第二个选项现在😅不行，我会在下一个版本修复它

rmadeiraneto

@artf使用默认值作为函数是可行的，感谢你的快速回复和提供解决这个问题的替代方案。 关于第一个建议，我认为问题不在于人们是否应该变异或不变异对象，因为我们讨论的是使用提供的方法（集合）。抱歉我没时间看源代码，但你很可能在“set”方法里变了默认对象，可能是因为引用来自组件生命周期的早期。同样，没有深入看代码，我假设当你将默认值与组件属性合并时，你保留了对默认对象的引用，而不是使用会返回副本的合并方法，比如 from immutable。 我会尽量找时间研究代码，并提出更具...

ClaudeCode

谢谢你举报，@rmadeiraneto。 关于组件属性的变化在所有实例中重现，而不仅仅是一个实例的好建议！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“c...

artf

谢谢@acantepie请在[proper repo]（https://github.com/GrapesJS/ckeditor）中打开问题，因为这不是核心相关的问题

ClaudeCode

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

krishnaeverestengineering

解决方法：https://github.com/GrapesJS/grapesjs/pull/5176

artf

谢谢@krishnaeverestengineering，但这实际上是将组件移入同父节点时的预期行为。这是因为“at”还应考虑组件本身的索引。 所以，如果你尝试将“组件1”移到索引0或1，什么都不会发生。如果你需要把它移到“组件2”以下，你必须标注索引2

krishnaeverestengineering

谢谢@krishnaeverestengineering，但这实际上是将组件移入同一父节点时的预期行为。这是因为“at”还应考虑组件本身的索引。 所以，如果你尝试将“组件1”移到索引0或1，什么都不会发生。如果你需要把它移到“组件2”以下，你必须标注索引2 但我不太理解它的使用场景。通常在最后版本中，'at '应该算是索引。那怎么把组件从0移到索引1呢？

artf

你好，@FaisalShaikhHA这是预期中的行为，但我猜“setRule”的文档有点误导。规则实际上是更新的（不会用相同的选择器创建新的规则），但样式只是被替换。 如果你需要添加新样式而不是替换它们，这就是你应该做的 “''js const selector = '#${this.getId（）}'; const rule = 编辑器。Css.getRule（selector）; 编辑。Css.setRule（selector， { ...统治？getStyle（），...

FaisalShaikhHA

感谢@artf的澄清

ClaudeCode

谢谢你举报，@FaisalShaikhHA。 关于编辑器的好问题。css.setRule API 没有按预期工作，它没有更新现有规则。推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （...

artf

https://github.com/GrapesJS/grapesjs/discussions/5163#discussioncomment-6162516

ClaudeCode

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

loclovepop

[screencast-www.lovepoptestsite.com-2023.06.01-001711.webm]（https://github.com/GrapesJS/grapesjs/assets/124012807/a171fbbb-dd8b-45a6-901c-d0c2519c8304） 这是关于bug的视频

artf

我看到触摸插件是正常工作的，确保加载时启用移动设备（比如加载后不要模拟），这样聚合物填充才能正确加载。

ClaudeCode

谢谢你举报，@loclovepop。 关于手机屏幕无法拖放，连加葡萄-触摸都不能的好建议！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”...

marktamis

我把一些tsconfig设置从一个正在运行的vite gjs项目复制到我的stenciljs项目里，现在它运行正常了。我觉得你需要对你的 Angular TSCONFIG 做些调整，这样它就不会再抛出错误了 下面是我正在运行的 Stencilsjs TSCONFIG： 似乎正是这个功能让编译成为可能的原因

Deepakanandrao

“skipLibCheck”：true， “skipLibCheck”： true “”成功了。谢谢@marktamis 👍

artf

是的，在我找到该TS输出😞的修复之前，这里需要用“skipLibCheck”： true”

rajevar

抱歉，是我错了。我没用最新的。

artf

@rajevar我无法用最新版本复现，你确定你用的是最新版本吗？

ClaudeCode

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

artf

如果属性的值与默认定义相同，则跳过。这由 ['avoidDefaults']（https://github.com/GrapesJS/grapesjs/blob/e217dc75d463a84333ee4d9f37216f4f56c77024/src/editor/config/config.ts#L250-L256） 配置选项控制，强烈建议尽量保持 JSON 小。

ClaudeCode

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

artf

请避免在未遵循问题模板的情况下打开错误问题。 你可以用一个合适的描述和用例来开启新的讨论。

ClaudeCode

谢谢你举报，@yashvi2026。 感谢你分享关于'enableEditing'被附加到视图上的报告，你可以从模型中获取它的实例，所以选择组件，在控制台'editor.getSelected（）.view.enableEditing（）'中运行。为了帮助团队调查并优先排序： 请提供： 一个最小可复现的例子（CodeSandbox/JSFiddle） 你的GrapesJS版本号 浏览器和操作系统信息 浏览器控制台的任何错误信息 重现问题的步骤 最有帮助的是什么： 简约代码示...