CODEWITHSUNDEEP
reactjs
Aditya Ponkshe
Aditya Ponkshe

Reputation: 3900

Add inline style in reactjs without using JSX

I am trying to add inline style to the element using reactjs. I found 

var divStyle = {
  color: 'white',
  backgroundImage: 'url(' + imgUrl + ')'
};

ReactDOM.render(<div style={divStyle}>Hello World!</div>, mountNode);

in reactjs docs. Thing is, it is not working without JSX.

I tried doing this. 

return (
        React.DOM.div({ className: 'eventsOuter'},
              {style:'divStyle'}
        )

But the style part is not working.

Is there any way to fix this?

Upvotes: 5

Views: 1078

Answers (1)

Dmitry Yaremenko
Dmitry Yaremenko

Reputation: 2580

You need to pass variable instead of variable name:

React.DOM.div({
    className: 'eventsOuter',
    style: divStyle
}, 'Hello World!')

Also you can compile online: on the babel website

Upvotes: 3

Related Questions