mardi 19 mai 2020

React inline style with ternary

Having a Checkbox element like this:

<Checkbox
    checked={this.props.someValues.indexOf(myValue) > -1}
/>

When that index has a positive value the checkbox gets checked.

I want to add different colors to the checkbox, for example if it is unchecked - blue, checked - red.

So I tried to do it like this:

<Checkbox
   checked={this.props.someValues.indexOf(myValue) > -1}
   {(this.props.someValues.indexOf(myValue) > -1) ? style= : style=}
   />

but it doesn't work.

Another try:

<Checkbox
   checked={this.props.someValues.indexOf(myValue) > -1}
   style={(this.props.someValues.indexOf(myValue) > -1) ?  :  }
   />

Is it possible to set the style inline with ternary operators and I'm doing it wrong or should I try a different way?




Aucun commentaire:

Enregistrer un commentaire