Btukfyl

I'm doing here is updating the state with the string which work something like the following:

 changeColorE(e){

    this.setState({error:"style={{backgroundColor :" +this.state.colorNew +"}}"},()=>console.log("-------",this.state.error))

 }

In render I've

const { error }=this.state;

I get the error here {error} it says

Parsing error: Unexpected token, expected "..."



<div className="col-2" {error}   onClick={this.changeColorE.bind(this)}></div>

How can {error} something like that be done for an element? Am I going the right way or whats the right way?
Why it doesn't work with just {error} and not {...error} ?

the errorClr doesn't work i'm passing the error to it n declared

    const { error }=this.state;

    const  {errorClr}={style:{color : {error}}}; // this doesnt work the way?



<div className="col-8" {...errorClr}>Please enter valid data</div>

The color proptery doesn't reflect.I've done no setstate. Can we not do something of this sort {style:{color : {error}}} ?

Dont save the style as a string, however save it as an object like

changeColorE(e){

    this.setState({

         error: {

             style: { backgroundColor : this.state.colorNew } 

         }

    },()=> console.log("-------",this.state.error))

 }

and then use it like

<div className="col-2" {...error} onClick={this.changeColorE.bind(this)}></div>