问题 #2777✓ 已解决提出于 2020年5月14日作者 kuhelbeher2 个反应

如何在样式管理器中更新样式

快速解答作者 Ju99ernaut2

我注意到一般来说,当你通过代码更新某个“组件”的样式时,它们不会反映在“样式管理器”里,除非你取消并重新选择该“组件”,而且我在文档里找不到关于刷新样式管理器的相关说明。 作为一个变通方法,你可以用: “''js editor.selectToggle(model); editor.select(model); @Ju99ernaut 不 如果你打算在“样式管理器”之外设置一些样式,可以查看[这里](https://grapesjs.com/docs/guides/Custom-CSS-parser.html#import-html-css)为什么你想用自定义CSS解析器

阅读下方完整回答 ↓

问题

你好。我创建了自定义组件,通过自定义资产管理器设置了 backgraound-image 自定义块代码: “JavaScript domc.addType('image-block', { 扩展:“默认”, 型号:{ 默认值() { 返回 { 名称:“背景图片”, 类型:“图像块”, 标签名称:“div”, 虚无:虚假, Droppable:确实如此, }; }, }, 浏览量:{ init() { this.listenTo(this.model, 'change:src', this.updateImage); }, 事件:{ dblclick:“onActive”, }, onActive() { editor.runCommand('open-assets'); }, updateImage(model, URL) { 如果 (URL) { const style = model.getStyle(); model.setStyle({ 'background-image': style['background-color'] ||'url(“${URL}”)', 'background-size': style['background-size'] ||“cover”, “背景-职位”: style['background-position'] ||“中心中心”, '背...

回答(3)

👍 最有帮助Ju99ernaut2020年5月18日

我注意到一般来说,当你通过代码更新某个“组件”的样式时,它们不会反映在“样式管理器”里,除非你取消并重新选择该“组件”,而且我在文档里找不到关于刷新样式管理器的相关说明。 作为一个变通方法,你可以用: “''js editor.selectToggle(model); editor.select(model); @Ju99ernaut 不 如果你打算在“样式管理器”之外设置一些样式,可以查看[这里](https://grapesjs.com/docs/guides/Custom-CSS-parser.html#import-html-css)为什么你想用自定义CSS解析器

Ju99ernaut2020年5月14日

这里他们使用#2728: “''js component.addStyle({ 'background-image': 'url('${url}')' })

我猜背景图像没有更新是因为设置了“src”属性,而不是“background-image”风格属性。
kuhelbeher2020年5月15日

@Ju99ernaut谢你的建议,但很遗憾没成功。 我还注意到像背景大小或背景重复这样的属性在样式管理器中也没有被正确反映,尽管它已经为所选组件设置了。

相关问答

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

问题 #2628

如何更新性状值

你好@artf非常感谢你带来的精彩项目, 我创建了一个新类型,它类似于普通链接,但链接标题会随着 ajax 更新。然后更新特质“linktitle”。它和画布的数值会更新,但“设置”中的特性仍然显示初始值,且没有变化。 必须更新该值的代码部分: 编辑。DomComponents...

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

问题 #2696

:我如何创建带有内置“图像”行为的背景图像块?

你好,我正在尝试创建带有背景图像的方块(类似于Grapedrop Image Box)。我添加了这样的新组件: “JavaScript domc.addType('image-block', { 扩展:“图像”, 型号:{ 默认值:function() { 返回 { 名称:“背...

2 个回答更新于 2020年4月8日

问题 #3239

如何动态地从组件脚本更新属性/属性?

我们有一个用例,想用 [Highcharts Editor](https://github.com/highcharts/highcharts-editor) 动态插入图表。我创建了一个组件,拖拽后会打开基于模态的组件,根据用户选择返回一个SVG图像。 我想知道如何把它加到模型...

4 个回答更新于 2021年2月3日

问题 #2417

组件中的 API 在部署后无法工作

Block.js => Component.js => 我们可以调用 API,并且在部署中传递整个 html 时它是正常工作的 块管理器内容属性中的脚本、正文、样式 但当 API 通过组件调用时,页面在部署加载时无法工作。** 它只在我把它放到编辑器里时生效,而作为已部署的 U...

3 个回答更新于 2022年7月21日

与此问题匹配的付费插件

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

查看全部插件

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

免费方案

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

浏览免费插件 →
高级方案

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

浏览高级插件 →

浏览插件分类

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