Как убрать класс у неактивного элемента React?

Question

[Egor]

Здравствуйте! Только начал изучать реакт, поэтому прошу прощения за глупый вопрос.
Нужно, чтобы при добавлении класса clicked одному элементу, он снимался с другого, как это сделать?

choiseCross(event) {
    event.target.classList.add('clicked');
}

render() {
    return (
         <div className="choise clicked" onClick={this.choiseCross}>X</div>
         <div className="choise" onClick={this.choiseCross}>O</div>
    );
}

Comments

[Владимир]

Читайте дальше, в реакте вот так event.target.classList.add('clicked') класс не ставят, читайте про синтетические ивенты и виртуал дом.
Между компонентами общение идет через Контекст API внутри для управления состоянием используют setState.
То что вы написали к реакту отношения не имеет

[Egor]

Владимир, Вот как. Спасибо, буду разбираться дальше)

Answer 1

[Дмитрий Свиридов]

Ты пытаешься использовать немного не тот подход. Тебе надо не убирать класс, а как раз его рендерить только для активного элемента. То есть при срабатывании onClick пиши в стейт некое значение, соответствующее твоему div-элементу. В сам метод render добавь при отрисовке каждого div условие с проверкой, равно ли его значение тому, что в стейте находится. Если да, то рендеришь класс clicked. Тебе для такой задачи пригдится библиотека classNames