search

ManuelDeLeon / viewmodel-react

Create your React components with view models.
MIT License
24 stars 3 forks source link

Styles applied via bindings do not work if they include !important #19

Open wildhart opened 7 years ago

wildhart commented 7 years ago

Looks like this is a wontfix in https://github.com/facebook/react/issues/1881, but I thought I'd mention it here in case people have the same issue and look here first.

Example({
  labelStyle: 'red',
  labelStyle2: 'red !important',
  render() {
    <div>
      <label b="style: {color: labelStyle}">This is red!</label>
      <label b="style: {color: labelStyle2}">This isn't</label>
    </div>
  }
})

The example above is a contrived demonstration. In my app I need to apply the styles via binding because they are part of an array of elements each with different background images, and I need to use !important on some of them to override an external stylesheet.

My only workaround was to apply different classes via binding, and set the styles in a stylesheet.