GrapesJS 问题

artf

谢谢@bgrand好主意，讨论已开启。 我对这个功能不太熟悉，如果你有任何改进该部分的建议，请告诉我。

GJSBlock

谢谢你举报，@bgrand-ch。 关于FEAT：在GitHub上启用“讨论”标签的建议很棒！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法：* 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change...

Ju99ernaut

遗憾的是，插件不会自动替换原始背景图像输入，所以你得手动替换。你需要想办法把这个添加到你的样式管理器配置里，并移除内置版本： “''js { ID：“背景-背景”， 财产：“背景”， 类型：“BG”， }, ``` 更多参考资料请点击这里 https://github.com/artf/grapesjs/blob/c136ea722383c0ece710ff3bbab1ce9b30f986ba/demo.html#L1154

GJSBlock

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

artf

谢谢@akmittal加载其实很酷也很实用，但目前我想避免扩展核心组件（如果有人通过扩展镜像创建新组件，可能会导致意想不到的行为）。 对于想使用“加载”属性的人来说，可以通过这种方式轻松扩展图像组件 “''js 编辑。DomComponents.addType（'image'， { 型号：{ 默认值：（） => （{ 特质：[ 'alt'， { 类型：“选择”， 名称：“加载中”， 标签：“装载中”， 默认：“渴望”， 选项：[ { id：“懒惰”，名字：“懒惰” }， {...

GJSBlock

谢谢你举报，@akmittal。 关于FEAT：添加图片的懒加载支持的好建议！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进行细致...

artf

谢谢@anlumo你说得对，那是个旧选项，我会去掉的。对于静态 CSS 规则，我们有 [这些选项]（https://github.com/artf/grapesjs/blob/210f87030d7d1e2aa2e5c427e4347b49ad258134/src/editor/config/config.js#L72-L77）

GJSBlock

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

GJSBlock

谢谢你举报，@Tal500。 关于HE（希伯来语）语言支持的建议很棒！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进行细致跟踪 构...

Ju99ernaut

看起来是底层浏览器API的问题，也就是说，'Document.execCommand（）' 所以我不确定这个问题能否解决，这里说它已被弃用，但实际上没有其他选择，反正'removeFormat' 命令似乎能正常工作，不会留下任何 span。不过你仍然可以使用第三方RTE系统，比如CKE

GJSBlock

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

theSC0RP

嘿，@Asifislam110，我不知道这是不是最好的解决方案，但这是我能想到的一个。

Asifislam110

@theSC0RP编辑器加载时，它会把文本从所有文本组件中移除。 在编辑器中插入文本框时，用户开始输入时“在此插入您的文本”这句话应该会自动消失。目前，你必须自己删除文本。

theSC0RP

哦，我错了！我以为你不想让文本组件在画布里有任何内容。 针对你的疑问，我猜你可以做类似选择组件时检查它是不是文本组件，在视图里你会看到“el”，如果是“插入你的文本”，可以把innerText改成“'”

ltenti-eventboost

这很合理，现在我只需要想办法把这个功能添加到我的构建器里。谢谢你，@Ju99ernaut！

bgrand-ch

你好， 对于未来的问题或技术问题（非漏洞），GitHub的[讨论]（https://github.com/artf/grapesjs/discussions）标签是最佳选择。 如果问题已解决，请关闭，或在[讨论]（https://github.com/artf/grapesjs/discussions）->[问答]（https://github.com/artf/grapesjs/discussions/categories/q-a）类别写一条详细的新消息（并关闭本期）。...

artf

你好，@ltenti-eventboost，我不太确定我是否准确理解你的问题出在哪里。 当你启用“componentFirst”编辑时，编辑器会对组件特定的CSS规则进行样式更改（例如'#cmp-id { color： red }'）。 点击“同步”按钮后，所有样式都会被移到当前的类选择器，组件专用规则内的样式会被移除，'.selected-class { color： red } #cmp-id {}'。 所以，从你描述的来看，我觉得挺合理的，但也许我漏掉了什么。

artf

本地storageManager会帮你完成所有工作，所以你不需要做现在那些手动操作。所以保留storageManager选项，把剩下的都删掉。 附言：使用useEffect要小心，添加一个空数组作为依赖，否则它会在每次渲染时调用初始化......

GJSBlock

谢谢你举报，@sanchit36。 关于[紧急!!的好问题 问题：如何在 reactjs 项目中实现 LocalStorage？？.推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （）...

artf

谢谢@emyasnikov我会关闭这个帖子，并保持漏洞问题开放

GJSBlock

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