React className изменяется, но стиль CSS не изменяется

У меня есть четыре имени класса, давайте назовем их красный-0, красный-1, синий-0, синий-1

CSS для red-0 и red-1 одинаков, CSS для blue-0 и blue-1 одинаков.

Мой компонент React меняет имена классов так, как я хочу. Моя проблема в том, что похоже, что компонент React игнорирует стили CSS, когда я применяю имя класса с тем же CSS, что и было прямо перед изменением состояния. Это реальный случай? Потому что мой CSS отлично меняется, когда, например, красный-0 в синий-0, но не красный-0 в красный-1.

Если у вас есть предложение, как я могу решить эту проблему, я буду очень признателен.

Мне приятель помог:

Трикс состоял в том, чтобы добавить обещание и сначала установить состояние на пустое имя класса, а затем добавить имя класса, которое я хотел, внутри обещания, например:

this.setState ({className: ''}, () => this.setState ({className: 'red-0'}));

Причина наличия четырех имен классов вместо двух заключалась в том, что я надеялся, что изменение имени класса вызовет новую анимацию, но этого не произошло, хотя это вызвало новые регулярные изменения CSS. В итоге я использовал только два имени класса: красный и синий