@artf，我一直在尝试在样式中使用 id 和类之间切换，所以我需要用程序方式更改 componentFirst 属性。但当我尝试更改配置时，行为没有变化。即使在演示中也无法正常工作。繁殖步骤：添加两个文本块给它们起同样的职业名称。在浏览器控制台中，使用 'editor.getConfig（）.selectorManager.componentFirst = false'给文字添加一些颜色。它只会被添加到选中的区块中附言：我还尝试在更改配置后使用editor.refresh（），但没有任何变化。

抢先体验

PageKit — 可自托管的 GrapesJS 建站工具，附完整源码。获取抢先体验

问题 #3509💬 已回答提出于 2021年6月1日作者 theSC0RP1 个反应

提问组件 style-manager

How to programmatically change componentFirst?

快速解答作者 artf❤ 1

你必须在更改那个选项 'editor.trigger（'component：toggled'）' 后重新触发选择

阅读下方完整回答 ↓

问题

@artf，我一直在尝试在样式中使用 id 和类之间切换，所以我需要用程序方式更改 componentFirst 属性。但当我尝试更改配置时，行为没有变化。即使在演示中也无法正常工作。繁殖步骤：

添加两个文本块
给它们起同样的职业名称。
在浏览器控制台中，使用 'editor.getConfig（）.selectorManager.componentFirst = false'
给文字添加一些颜色。它只会被添加到选中的区块中

附言：我还尝试在更改配置后使用editor.refresh（），但没有任何变化。

回答（2）

artf• 2021年6月10日

你必须在更改那个选项 'editor.trigger（'component：toggled'）' 后重新触发选择

GJSBlock• 2026年5月17日

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

在 GitHub 上查看完整讨论 →