风格导入问题
问题
你好,@artf, 详细描述这个漏洞 在用 GrapesJS 创建新模板时,我遇到了一个情况:当我们尝试从 import modal 导入 CSS 时,编辑器中没有反映出来。在一个空白编辑器上,我创建了一个模板,添加了HTML和CSS。之后,我需要在CSS部分做一些修改,为此,我选择了编辑器顶部的导入选项,滚动到底部的样式标签。我看到了导致问题的样式,我选中并删除了它。之后,我点击了导入按钮。 然后我检查了模板,样式问题依然存在。于是我再次打开导入模态确认样式不存在,并正确地移除了它。我看到我移除的风格还在风格标签里。我尝试过多次删除并导入。它没有从编辑器中移除。我再次打开导入模态时,它就在了。 目前的行为是什么? 从导入模态中移除样式后,编辑器中不会反映样式。移除HTML元素并导入代码时没有问题。 预期的行为是什么? 通过导入选项导入CSS(添加/删除/更新)后,编辑器中应该会反映出它。 使用的插件 Grapesjs-lory-slider,grapesjs-tabs,grapesjs-custom-code,grapesjs-touch,grapesjs-parser-postcs,grapesjs-tooltip,grapesjs-tui-image-editor,grapesjs-typed,grapesjs-style-bg,gjs-preset-webpage,gra...
回答(4)
你好@javadsamiee这个问题在最新版本的预设插件上已经修复了
你好,@SintoDema问题就在这里 https://github.com/artf/grapesjs-preset-webpage/blob/3e5a9e12998c9a32b6f1199953084163678e6c17/src/commands/openImport.js#L15-L18
如你所见,它更新了组件,但不会清除样式模块。 我现在没时间做那个插件,但我建议你在那里开个问题/PR,总有一天我会修复的。
你好@SintoDema问题就在这里 https://github.com/artf/grapesjs-preset-webpage/blob/3e5a9e12998c9a32b6f1199953084163678e6c17/src/commands/openImport.js#L15-L18
如你所见,它会更新组件,但不会清除样式模块。我现在没时间做那个插件,但我建议你在那里开个问题/PR,总有一天我会修复的。
@artf 这个问题有最新进展吗?
谢谢你举报,@SintoDema。 样式导入问题的问题似乎是竞态条件或状态管理时序问题。这通常发生在组件生命周期事件和DOM修改重叠时,导致状态不一致。 尝试什么: 添加setTimeout包装器以确保DOM已稳定: “JavaScript setTimeout(() => { 你在这里的行动 }, 0); 推荐的下一步步骤: 如果还没测试过,请用最新的GrapesJS版本测试 提供最小可重复的示例(CodeSandbox)——这有助于团队更快识别根本原因 在报告中包含 GrapesJS 版本、浏览器和控制台错误
相关问答
通过相似的问题讨论继续研究。
问题 #3612
葡萄的滑块按钮和标签键都没有按预期工作
版本 0.17.19(grapesjs) 版本 0.1.5(grapesjs-lory-slider) 版本 1.0.6(grapesjs-tabs) 你能重现演示中的bug吗? 不 预期的行为是什么? 我应该能在点击前一、下一页按钮和标签名时,浏览不同的幻灯片和标签页。 详细...
问题 #5297
GetJS 无法工作
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? 版本 115.0.5790.171(官方构建)(64位)可复制演示链接 https://codesandbox.io/s/1r0w2pk1vl?file=/index.html描述一下那个虫子 如何复...
问题 #4765
官方的解析@keyframes方法并不起作用
葡萄JS版本[X] 我确认使用最新版本的GrapesJS你用的是什么浏览器? Chrome v107描述一下那个虫子 如何复现这个漏洞?按照[这里](https://grapesjs.com/docs/guides/Custom-CSS-parser.html#rule-obj...
问题 #3465
更新会破坏一些CSS功能
警告 请阅读并遵循接下来的三步,然后在发布问题前删除它们遵守贡献指南 https://github.com/artf/grapesjs/blob/master/CONTRIBUTING.md先快速搜索一下,看看有没有人没开同样的问题所有相关陈述/问题都必须填写/回答,否则问题可...
与此问题匹配的付费插件
根据问题关键词和标签相关性精选,助你更快交付。
正在加载付费插件推荐……
相关教程
关于同一主题的深入指南。
教程
GrapesJS DevTools: A Developer Panel Inside Your Editor
If you've ever debugged GrapesJS with console.log(editor.getSelected()) and a dozen throwaway event listeners — this post is for you.
教程
How to Build a Production GrapesJS Editor: The Complete Walkthrough of Brief, Preset, Plugins, and Services
A complete walkthrough of building a production GrapesJS editor: how to choose a preset, pick plugins, and scope setup services without burning a sprint.
教程
Big Updates: TinyMCE 8 and Placeholder 2.0 for GrapesJS
In May we shipped major updates to two of our most popular GrapesJS plugins — TinyMCE Inline Text Editor and Placeholder.
浏览插件分类
直接跳转到市场上的插件分类页面。