Почему так пишут код?

Есть код меняющий классы (добавляет или удаляет):
https://jsfiddle.net/rjhzf0wk/

там есть вот такая строка:

<div className={(this.state.opened) ? "mystyle" : ""}>Текст</div>

И я подумал а почему бы не написать вот так:

<div className="mystyle">{this.state.opened}Текст</div>

а в css написать display:none для mystyle.
Но так не работает.

Часто вижу что в React коде пишут значением атрибута className не название класса а в значение className пишут какое-то условие. Почему именно так пишут? Что это за фишка такая писать не название класса а условие?