Parse styles to a Css string

快速解答作者 artf

你应该可以用“editorInstance.getCss（）”从任何 GrapesJS 实例中获取 CSS。这基本上是从“样式”JSON 生成 CSS

问题

你好@artf！ “JavaScript “编辑”： { “CSS”： “* { 框大小：border-box; }#wrapper{字体家族：Helvetica，Arial Black，无衬线;color：#9500b3;}“， “html”：“<div id=\”iecr\“>将你的文本插入此处</div>”， “资产”：“[]”， “styles”：“[{\”selectors\“：[\”#wrapper\“]，\”style\“：{\”font-family\“：\”Helvetica，Arial Black，无衬线\“，\”color\“：\”#9500b3\“}}，]”， “组件”：“[]” } }

有没有办法把样式解析成CSS字符串？
这在你存储多个GrapesJs实例并想更新所有实例CSS的情况下会很有帮助。你可以操作样式，因为那是数组，而且很可靠。目前，在CSS上我用正则表达式来定位和更新。我更愿意解析“editor.styles”并覆盖“editor.css”。

回答（2）

artf• 2021年2月17日

你应该可以用“editorInstance.getCss（）”从任何 GrapesJS 实例中获取 CSS。这基本上是从“样式”JSON 生成 CSS

GJSBlock• 2026年5月17日

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

在 GitHub 上查看完整讨论 →