У меня есть стилизованный набор компонентов, которые составляют в основном то, что составляет боковое навигационное меню. Сам компонент выглядит примерно так:
const Sidebar = ({ children }) => (
<div className={styles.sidebar}>
{children}
</div>
);
Я хочу обернуть его в другой компонент, возможно, под названием Transition
, который управляет компонентом Sidebar
-
1) В каком направлении он движется от экрана к экрану
2) Открыто или закрыто меню
3) Я также пытаюсь определить способ плавного отображения или закрытия меню, используя переходы, а не просто отображать или исчезать.
И он должен обрабатываться с использованием реквизита, переданного в компонент Transition
, чтобы его можно было запускать соответствующим образом.
Если у кого-нибудь есть указания на то, как начать, это было бы очень признательно - я не смог найти слишком много специфического для моей ситуации во время исследования. Лучшей идеей было бы как-то (я пока не уверен, как) условно применить стили CSS, которые управляют положением меню (styles.left
, styles.right
и т. Д.) - но тогда я не уверен, как справиться с переходом в меню.