How can i use hover in attribute using javascript object?

Question

const customPanelStyle = {
   'background-color': 'red', 
   'border': '1px solid green',
    ':hover'{
        'background': 'blue'    
    }
}
class some extends React.Component{
render(){
return(
   <Panel header={value} key="1" style={customPanelStyle} >
     <p>{this.state.content[key]}</p>
   </Panel>
)
}

}

How can use o attribute hover in this case? My exemple doesn't work.. what i have to do?

Already answered here https://stackoverflow.com/a/52017547/4062197 — ymz, Feb 14 '19 at 12:59

madalinivascu · Accepted Answer · 2019-02-14T13:40:41.247

1

You need the Radium library

import Radium from 'radium';
 some = Radium(some);
    const customPanelStyle = {
       'background-color': 'red', 
       'border': '1px solid green',
        ':hover':{
            'background': 'blue'    
        }
    }

more info about radium

edited Feb 14 '19 at 13:40

answered Feb 14 '19 at 13:01

madalinivascu

32,064
4
39
55

it doesn't work too... gets red in '{', saying it expects a ':', but even putting ':' does not work... – Deborah L. Christinne Feb 14 '19 at 13:29
updated my answer – madalinivascu Feb 14 '19 at 13:42

How can i use hover in attribute using javascript object?

1 Answers1