javascript - 如何禁用样式编辑器

Question

我正在尝试使用带有网页插件的葡萄 js页面构建器。

问题是我无法找到完全禁用他们拥有的样式编辑器的方法（当您单击元素时我设法不自动选择样式管理器）但我想完全删除用户编辑的选项现有样式。

基本上，用户必须只能拖动现有块并编辑其中的文本，而不能以任何方式设置它们的样式。

score 1 · Accepted Answer

您还可以通过将样式管理器配置的“appendTo”属性更改为不在 DOM 中的新 div 来实现这一点

const editor = grapesjs.init({
 styleManager: {
   appendTo: document.createElement('div'),
 },
 ...
})

这样，样式管理器就不会被渲染。

score 0 · Accepted Answer

我解决问题的方法是复制和粘贴node_modules/grapesjs-preset-webpage/src/panels/index.js并简单地注释掉定义我想要摆脱的面板的代码。

我还复制并粘贴node_modules/grapesjs-preset-webpage/src/index.js并编辑它以导入我的 panel.js 文件。

这肯定不是最好的方法，但现在就可以了。

PS。我还想过简单地使用 CSS 隐藏面板，但这似乎比这更像是一种 hack。

2 回答 2