Karin_Park
@Karin_Park

Как прописать классы в css modules в зависимости от условия (React)?

Всем привет.
Есть проект на реакте. В компоненте appointments есть родительский блок без стилей.
Я хочу использовать этот компонент в двух разных местах(компонентах) с разными стилями в зависимости от того в каком месте он вызывается. Как лучше это реализовать? Или подскажите что где почитать.
для лучшего объяснения:

Компонент appointments:
Условие: если это компонент LastAppointments, то к блоку применяется класс ROW, если это компонент AllAppointments то класс COLUMN.
<div className={Row или Column}> какой то код </div>


компонент LastAppointments:
вызов компонента appointments с классом row.

компонент AllAppointments:
вызов компонента appointments с классом column
  • Вопрос задан
  • 60 просмотров
Решения вопроса 1
8XL
@8XL
Я высокий, но ниже, чем вы подумали.
Можно без лишних стейтов обойтись.

<LastAppointments name={'LastAppointments'} />

То есть передаешь в пропсы компонента его имя(ну или любой другой идентификатор)

<div className={ props.name == 'LastAppointments' ? 'row' : 'column' }> какой то код </div>


В самом диве проверяешь, какое имя пришло в пропсах.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
kirbi1996
@kirbi1996
создаешь
[state, setState] = useState(false)
его меняешь как надо
<div className={ state ? "row" : "column"}> какой то код </div>
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы