Функциональный компонент React не обновляет условный стиль значка Font Awesome - PullRequest
0 голосов
/ 25 мая 2020

Я могу добиться условного стиля, если оберну значок внутри span или div следующим образом:

narrationIcon : {
    display: 'none'
}

<span className={`${props.narration ? '' : classes.narrationIcon}`}>
    <i className="fas fa-volume fa-2x"></i>
</span>

<span style={{ display: props.narration ? '' : 'none' }}>
    <i className="fas fa-volume fa-2x"></i>
</span>

Однако при таком использовании устанавливается только начальный стиль:

<i className="fas fa-volume fa-2x" style={{ display: props.narration ? 'inherit' : 'none'}}></i> 

<i className={`fas fa-volume fa-2x ${props.narration ? '' : classes.narrationIcon}`}></i>

Почему это? Это связано с тем, что Font Awesome генерирует svg под капотом?

...