问题 #2458💬 已回答提出于 2019年12月17日作者 angyLe0 个反应

在StyleManager配置中设置css属性的默认值不会影响新添加块的样式吗?

快速解答作者 artf

你好@angyLe风格管理器只是以一种“盲路”的方式构建属性,其中一些属性并不直接影响目标(组件/规则)。在这种情况下,“默认值”更像是一个提示,提醒用户该属性没有价值。因此,从实际角度看,你必须按照CSS规范来构建属性,而让它们不同其实并不太合理。

阅读下方完整回答 ↓

问题

我有个问题。当 CSS 属性添加到 StyleManager 配置中时,例如我添加了颜色并将默认值设为绿色(仅供测试):

'名称:'排版', 开场:假, buildProps: ['color'], properties:[{ name: 'font color', property: 'color', default: “green”}, ...'

看起来它不会影响新添加方块的文字颜色?我把文本块放到画布上——文字颜色是黑色的。当我打开样式管理器面板时,我看到那个颜色被设置为绿色。我尝试的其他属性(宽度、高度)也是一样。

回答(3)

artf2019年12月18日

你好@angyLe风格管理器只是以一种“盲路”的方式构建属性,其中一些属性并不直接影响目标(组件/规则)。在这种情况下,“默认值”更像是一个提示,提醒用户该属性没有价值。因此,从实际角度看,你必须按照CSS规范来构建属性,而让它们不同其实并不太合理。

angyLe2019年12月18日

我不想让属性在规格上有所不同。我只是想为已有的属性设置默认值。比如我希望文本框的宽度是100px,所以当它添加到画布时,宽度是100px。我以为可以在StyleManager里设置属性的默认值“宽度”来配置。但看起来这不会影响添加到画布上的方框宽度。 还是我做错了什么?我该如何实现这个目标?

balchen2019年12月18日

@artf抱歉,我没听懂你的回答(@angyLe和我一起在系统中实现葡萄,所以我知道问题是什么)。 当我读到你的回答时,我理解你的意思是: 1)属性的默认值不会立即应用于新的组件实例 2)属性的默认值在样式管理器中显示,仿佛已经应用到组件上,即使实际上没有 这听起来不太对,所以我觉得我没理解你的回答,或者你是基于不同的理解来回答这个问题。 我非常希望能详细说明我们应该如何使用默认值,以及如果使用默认值,葡萄会不会这样表现。 问题的背景与拖拽模式有关:绝对。我们想用 grapesjs 来做固定设计,所以用 grapesjs 和 dragMode: absolute 一起。 当我们这样做时,我们...

相关问答

通过相似的问题讨论继续研究。

问题 #5207

创建多页面时的重复CSS

葡萄JS版本 [X] 我确认使用最新版本的GrapesJS 你用的是什么浏览器? Chrome最新款 可复制演示链接 https://codesandbox.io/s/withered-bush-wv29dx?file=/index.js 描述一下那个虫子 如何复现这个漏洞?....

3 个回答更新于 2024年9月11日

问题 #2640

使用Stylemanager添加额外属性以更改所选方块的属性

感谢你提供这个超棒的插件。我正在把它和我当前的项目整合起来。我对它有一个问题。 这是我的代码,我添加了一个带有3个输入字段的新扇区,我想用这些输入字段中的值更改所选块的属性(id, readOnly)。例如:我想用我的功能更改所选块的ID。我该如何实现这一点? 编辑。Style...

3 个回答更新于 2020年3月18日

问题 #1753

StyleManager - SectorsView - addToCollection() 使用“name”属性构建 ID,但因多个空格或特殊字符而失败

你好@artf, 利用grapesjs.init()方法中的pluginOpts属性,我通过Newsletter插件自定义了样式管理器中显示的扇区,如下: “''js Grapesjs.init({ [...] 插件:['gjs-plugin-ckeditor', 'gjs-b...

3 个回答更新于 2020年1月27日

问题 #1475

向 styleManager 添加过滤器

你好, 我正在尝试为样式添加一个过滤器属性。我遇到的问题是,该性质要求两个参数:1. 滤波器的类型 2.力量。例如滤镜:模糊(10%)。 我遇到的问题是,添加到CSS文件后,我会出现——筛选:模糊10%。 我知道应该用 property.functionName 来修复这个问题...

3 个回答更新于 2019年11月4日

与此问题匹配的付费插件

根据问题关键词和标签相关性精选,助你更快交付。

查看全部插件

正在加载付费插件推荐……

免费方案

在以下平台查看开源 GrapesJS 插件: GitHub 或在我们的免费目录中快速搜索。

浏览免费插件 →
高级方案

高级插件提供支持、定期更新和生产就绪的功能——为你节省数天的集成工作。

浏览高级插件 →

浏览插件分类

直接跳转到市场上的插件分类页面。