#34342021年5月5日作者 advancedsoftwarecanada4 个回答
你可以在控制台输入“grapesjs.version”获得版本 是的：https://jsfiddle.net/75a9u1cf/2/ 预期的行为是什么？ 我期望能在编辑器中编辑HTML和内容 详细描述那个漏洞** 屏幕是纯白色的，我能看到形状和拖动元素，但编辑器就是无法显示内容 半解：https://jsfiddle.net/75a9u1cf/3/
advancedsoftwarecanada
这个问题是可以解决的。我只是把HTML/JS应用换成了平面HTML——禁用了所有愚蠢的加载效果。我会在不使用编辑器时用外部脚本做一些花哨的操作。 万岁，葡萄。
advancedsoftwarecanada
![图片]（https://user-images.githubusercontent.com/1661561/117187316-cc15ef80-ada9-11eb-922e-de033b92a7e8.png）
advancedsoftwarecanada
半解决了，我在谷歌上找到了一些东西： https://jsfiddle.net/75a9u1cf/3/ 但有些图片仍然无法使用。
#34332021年5月5日作者 divesham2 个回答
警告 请阅读并遵循接下来的三步，然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下，看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答，否则问题可能已结案JSFiddle 入门模板 https://jsfiddle.net/szLp8h4nCodeSandbox 入门模板 https://codesandbox.io/s/1r0w2pk1vl 你想给GrapesJS添加什么？ 详细描述你的功能需求详细 最新版本有替代方案吗？[ ] 是的（描述替代方案）[x] 不 这是否与某个问题有关？[x] 是的（请...
divesham
https://github.com/artf/grapesjs/issues/1381
ClaudeCode
谢谢你举报，@divesham。 关于FET：视频无法播放的建议很棒！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进行细致跟踪 构...
#34322021年5月5日作者 SintoDema2 个回答
你好，@artf， 我们能在 GrapesJS 编辑器中使用 [Wistia]（https://wistia.com/） 吗？我想像Vimeo在编辑器中使用的那样使用它。 ![图片]（https://user-images.githubusercontent.com/68583645/117104731-4b032c00-ad9a-11eb-9ddd-d7bb8acb41da.png） 情景： 我在我的Wistia领域有个视频，请让路径 https://mydomain.wistia.com/medias/VIDEO_ID。我必须添加那个URL或视频，因为我们正在编辑器>视频设置中添加带有视频ID的YouTube视频链接。 期待屏...
artf
当然，只要检查当前的 [ComponentVideo]（https://github.com/artf/grapesjs/blob/dev/src/dom_components/model/ComponentVideo.js） 实现，并根据需要扩展它。
ClaudeCode
谢谢你举报，@SintoDema。 关于*的好问题。GrapesJS 推荐的方法是使用事件驱动 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （） => console.log（'something changed'））; 组件生命周期...
#34312021年5月5日作者 bgrand-ch2 个回答
你想给GrapesJS添加什么？ 启用GitHub上的“讨论”标签。 https://docs.github.com/en/discussions 详细描述你的功能需求详细 “问题”标签被各种问题和一些根本不是问题的问题污染。 启用“讨论”标签页将促进GrapesJS社区之间的互动，并更轻松地提问。 最新版本有替代方案吗？[ ] 是的（描述替代方案）[x] 不 这是否与某个问题有关？[ ] 是的（请提供本期链接）[x] 不
artf
谢谢@bgrand好主意，讨论已开启。 我对这个功能不太熟悉，如果你有任何改进该部分的建议，请告诉我。
ClaudeCode
谢谢你举报，@bgrand-ch。 关于FEAT：在GitHub上启用“讨论”标签的建议很棒！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法：* 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change...
#34292021年5月4日作者 justin37372 个回答
你好@artf 感谢你在这里所做的一切 但我试着用这个插件，但就是做不到 ![图片]（https://i.imgur.com/gaC65t1.png） 版本：0.17.3 你能重现演示中的这个bug吗？[x] 是的[ ] 不 详细描述那个漏洞** 没有显示插件 目前的行为是什么？ 什么都没发生。 你能附上截图、截图或实时演示吗？[x] 是的[ ] 不 https://jsfiddle.net/e4pbsgm0/
Ju99ernaut
遗憾的是，插件不会自动替换原始背景图像输入，所以你得手动替换。你需要想办法把这个添加到你的样式管理器配置里，并移除内置版本： “''js { ID：“背景-背景”， 财产：“背景”， 类型：“BG”， }, ``` 更多参考资料请点击这里 https://github.com/artf/grapesjs/blob/c136ea722383c0ece710ff3bbab1ce9b30f986ba/demo.html#L1154
ClaudeCode
谢谢你举报，@justin3737。 没有显示 grapesjs-style-bg 插件的问题似乎是竞态条件或状态管理时序的问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（CodeSandbox）——这有...
#34272021年5月1日作者 akmittal2 个回答
你想给GrapesJS添加什么？ 懒惰地加载图片支持。 详细描述你的功能需求详细 最新浏览器支持使用加载属性进行延迟加载图像。'<img src=“myimg.png” loading =“lazy”>'。有两个可能的数值：“渴望”和“懒惰”。如果没有提供加载属性，图像加载会变得急切。 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img 最新版本有替代方案吗？[ ] 是的（描述替代方案）[x] 不 这是否与某个问题有关？[ ] 是的（请提供本期链接）[x] 不
artf
谢谢@akmittal加载其实很酷也很实用，但目前我想避免扩展核心组件（如果有人通过扩展镜像创建新组件，可能会导致意想不到的行为）。 对于想使用“加载”属性的人来说，可以通过这种方式轻松扩展图像组件 “''js 编辑。DomComponents.addType（'image'， { 型号：{ 默认值：（） => （{ 特质：[ 'alt'， { 类型：“选择”， 名称：“加载中”， 标签：“装载中”， 默认：“渴望”， 选项：[ { id：“懒惰”，名字：“懒惰” }， {...
ClaudeCode
谢谢你举报，@akmittal。 关于FEAT：添加图片的懒加载支持的好建议！虽然这个具体功能还没有出现在核心 API 中，但有几种方法可以实现类似的行为。 使用事件系统： “JavaScript editor.on（'component：update'， （component） => { 你的逻辑 }); ``` 替代方法： 听取“selector：add”以获取CSS选择器更改 使用“selector：custom”来表示自定义规则 利用“change：*”事件进行细致...
#34252021年4月30日作者 anlumo2 个回答
CssComposer 的 [示例配置文件]（https://github.com/artf/grapesjs/blob/c3a49015df45eb49b0beb605e45ead1ea56a3af8/src/css_composer/config/config.js#L6） 引用了一个 'staticRules' 属性。这个属性名称在源代码的其他地方没有使用（通过[GitHub搜索]（https://github.com/artf/grapesjs/search?q=staticRules）验证），也没有任何作用。 版本： 0.17.3 你能重现演示中的bug吗？[ ] 是的[X] 不 （其实不太适用） 预期的行为是什么？ 把...
artf
谢谢@anlumo你说得对，那是个旧选项，我会去掉的。对于静态 CSS 规则，我们有 [这些选项]（https://github.com/artf/grapesjs/blob/210f87030d7d1e2aa2e5c427e4347b49ad258134/src/editor/config/config.js#L72-L77）
ClaudeCode
谢谢你举报，@anlumo。 staticRules for CssComposer Non-Functional 的问题似乎是竞赛条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时，导致状态不一致。 尝试什么： 添加setTimeout包装器以确保DOM已稳定： “JavaScript setTimeout（（） => { 你在这里的行动 }, 0); 推荐的下一步步骤： 如果还没测试过，请用最新的GrapesJS版本测试 提供最小可重复的示例（Cod...
#34222021年4月29日作者 Asifislam1104 个回答
我想像占位符一样，移除文本组件中的默认文本。每次拖动文本组件时，我们都需要手动移除默认文本。
theSC0RP
嘿，@Asifislam110，我不知道这是不是最好的解决方案，但这是我能想到的一个。
Asifislam110
@theSC0RP编辑器加载时，它会把文本从所有文本组件中移除。 在编辑器中插入文本框时，用户开始输入时“在此插入您的文本”这句话应该会自动消失。目前，你必须自己删除文本。
theSC0RP
哦，我错了！我以为你不想让文本组件在画布里有任何内容。 针对你的疑问，我猜你可以做类似选择组件时检查它是不是文本组件，在视图里你会看到“el”，如果是“插入你的文本”，可以把innerText改成“'”
#34212021年4月29日作者 ltenti-eventboost4 个回答
我用 componentFirst 设置为 true，让用户对他们选择的组件应用所需的样式。 选择一个应用特定组件类型 CSS 类的组件，并点击“同步”按钮，会使选择器从组件 ID 切换到相应的 CSS 类。 现在我找不到办法回去丢弃那个以组件类为选择器的 CSS 规则，因此该组件的每个新实例样式都一样。 谢谢你的帮助！
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 {}'。 所以，从你描述的来看，我觉得挺合理的，但也许我漏掉了什么。
#34202021年4月28日作者 sanchit362 个回答
我正在尝试在 Reactjs 应用中实现 localstorage，但不知为何它没有在 localstorage 中存储数据 “JavaScript useEffect（（） => { const templateComponent = JSON.parse（ localStorage.getItem（“gjs-components”） ); console.log（模板组件）; const templateStyle = JSON.parse（localStorage.getItem（“gjs-style”））; console.log（模板样式）; const editor = Grapesjs.init（{ 容器：“#edi...
artf
本地storageManager会帮你完成所有工作，所以你不需要做现在那些手动操作。所以保留storageManager选项，把剩下的都删掉。 附言：使用useEffect要小心，添加一个空数组作为依赖，否则它会在每次渲染时调用初始化......
ClaudeCode
谢谢你举报，@sanchit36。 关于[紧急!!的好问题 问题：如何在 reactjs 项目中实现 LocalStorage？？.推荐的 StyleManager 方法是使用事件驱动的 API。 从这里开始： 查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/） 寻找“on（）”事件监听器方法 大多数操作可以通过监听编辑器和组件事件来实现 常见模式： “JavaScript 留意变化 editor.on（'change'， （）...