Issue #2654Opened March 15, 2020by AbdiasM6 reactions

How to get the changed property from StyleManager

Question

Hi,

Is there a way to find out which property was changed in the StyleManager? For eg. If I select a Text component and change its background-color property from the StyleManager, is there any event where I can get the property that was changed. I've tried the 'component:styleUpdate' event, but it passes the component's model as argument, not the property.

Any help is appreciated.

Answers (3)

pouyamiralayiMarch 18, 20203 reactions

@AbdiasM i think this is kinda backbone related stuff and to my knowledge currently not possible. This is how it should be:

editor.on('component:styleUpdate', component => {
        console.log(Object.keys(component.changedAttributes()))
})

Cheers!

artfMarch 19, 20203 reactions

Actually, you get the changed property as a second argument of the callback

editor.on('component:styleUpdate', (component, propChanged) => {
	...
})
pouyamiralayiMarch 16, 20200 reactions

Hi @AbdiasM based on component:styleUpdate or component:styleUpdate:{propertyName} you can get the property like below:

editor.on('component:styleUpdate:background-image', component => {
    const sm = editor.StyleManager
    const model = sm.getModelToStyle(component)
    // the model can be a Component or CssRule
    const bg = model.getStyle()['background-image']
    //...

Cheers!

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.