Facebook officially recommends that people define their
style as a JavaScript Object: http://facebook.github.io/react/tips/inline-styles.html
e.g:
var divStyle = {
color: 'white',
backgroundImage: 'url('/sitelet?url=https%3A%2F%2Fgithub.com%2Fdwyl%2Flearn-react%2Fissues%2F%253C%2Fspan%253E%2520%253Cspan%2520class%3D%2522pl-c1%2522%253E%2B%253C%2Fspan%253E%2520%253Cspan%2520class%3D%2522pl-s1%2522%253EimgUrl%253C%2Fspan%253E%2520%253Cspan%2520class%3D%2522pl-c1%2522%253E%2B%253C%2Fspan%253E%2520%253Cspan%2520class%3D%2522pl-s%2522%253E')',
WebkitTransition: 'all', // note the capital 'W' here
msTransition: 'all' // 'ms' is the only lowercase vendor prefix
};
ReactDOM.render(<div style={divStyle}>Hello World!</div>, mountNode);Does anybody else think that in-lining styles as JS inside Components is a _debugging nightmare_ waiting to happen (*as an app gets larger and new people add hacks & overrides to mask previous CSS instead of editing the CSS in the style sheet...?
Facebook officially recommends that people define their
style as a JavaScript Object: http://facebook.github.io/react/tips/inline-styles.html
e.g:
Does anybody else think that in-lining styles as JS inside Components is a _debugging nightmare_ waiting to happen (*as an app gets larger and new people add hacks & overrides to mask previous CSS instead of editing the CSS in the style sheet...?