版本：0.16.34 预期的行为是什么？编辑器初始化时，没有选择任何元素，因此样式管理器应像编辑器配置中未使用“appendTo”时一样，提示“使用样式管理器前选择元素”。目前的行为是什么？在编辑器配置中使用“appendTo”时，像这样：样式管理器开始时显示所有扇区，但未选择任何元素演示同样的行为也可以在 https://grapesjs.com/docs/getting-started.html#style-manager 的例子中看到

如果你在自定义元素中使用 StyleManager，那你必须自己处理那个状态。 '''html 选择一个元素

问题 #3242💬 已回答提出于 2021年1月20日作者 Nielsticot0 个反应

当样式管理器在另一个 div 中时，“使用样式管理器前选择元素”的消息不显示

快速解答作者 mosh-tudor

我用这段代码来解决这个问题： “''js const showStylesSector = editor => { const stylesButton = 编辑器。Panels.getButton（“panel-sidebar-header”， “show-styles”）; const layersButton = 编辑器。Panels.getButton（“panel-sidebar-header”， “show-layers”）; 如果图层管理器处于激活状态，请禁用此功能。如果（！layersButton.attributes.active） { stylesButton.set（'active'，1）; } }; e...

阅读下方完整回答 ↓

问题

版本：0.16.34

预期的行为是什么？

编辑器初始化时，没有选择任何元素，因此样式管理器应像编辑器配置中未使用“appendTo”时一样，提示“使用样式管理器前选择元素”。

目前的行为是什么？

在编辑器配置中使用“appendTo”时，像这样：

VAR Editor = Grapesjs.init（{
  ...
  styleManager： {
      附录：“#styles”
  },
  ...
}

样式管理器开始时显示所有扇区，但未选择任何元素

演示

同样的行为也可以在 https://grapesjs.com/docs/getting-started.html#style-manager 的例子中看到

回答（4）

mosh-tudor• 2021年1月20日

Nielsticot• 2021年1月21日

这不是我想要的，我的问题是在选择任何元素之前，也就是在触发“component：selected”事件之前。我通过在编辑器加载时选择一个元素暂时解决了这个问题，但这并不是我真正想要的

editor.on（'load'， （） => {
    editor.select（editor.getWrapper（）.find（'#entry-point'）[0]）
});

artf• 2021年1月28日

如果你在自定义元素中使用 StyleManager，那你必须自己处理那个状态。 '''html <div class=“sm-wrapper”> <div id=“styles”></div> <div class=“sm-empty-state”> 选择一个元素 </div> </div>

ClaudeCode• 2026年5月17日

谢谢你举报，@Nielsticot。关于当样式管理器在另一个 div 中时，“在使用样式管理器前选择元素”这一消息不显示，这个问题很棒。ProseMirror 推荐的方法是使用事件驱动的 API。从这里开始：查看你所在模块的[GrapesJS文档]（https://grapesjs.com/docs/）寻找“on（）”事件监听器方法大多数操作可以通过监听编辑器和组件事件来实现常见模式： “JavaScript 留意变化 editor.on（'change'，（） => console.log（'something changed'））; 组件生命周期 editor.on（'co...

在 GitHub 上查看完整讨论 →