3 ms·
Why do className={this.state.playing ? "hidden" : "showing"} instead of <div> {(this.state.playing ? <Board/> : <Wordform/>
by ufo 12y ago
Why do
className={this.state.playing ? "hidden" : "showing"}
instead of
<div>
{(this.state.playing
? <Board/>
: <Wordform/> )}
</div>
- sehr 12y agoPerformance, I think.
- deleted 12y ago[deleted]
- krawaller 12y agoI touch on this in a post - I did try the latter, but got a React warning in the console about unmounted components. That, together with a comment in the official docs, made me go with the show/hide approach. Although as pointed out in the Disqus comment, choosingg what to render is also fine, I probably did something silly stemming from not fully understanding the component life cycle.
- pselbert 12y agoIt is much simpler to animate between two classes in straight CSS. That's the primary reason I favor the `className` approach.
- lobster_johnson 12y agoReact has a solution for that which actually automatically applies class names as components are inserted and removed: http://facebook.github.io/react/docs/animation.html http://facebook.github.io/react/docs/animation.html. It's not perfect, and it's better than doing it manually.