Описание тега react-transition-group
Предоставляет простые компоненты, полезные для определения переходов входа и выхода. React Transition Group не является библиотекой анимации, как React-Motion, она не анимирует стили сама по себе. Вместо этого он предоставляет этапы перехода, управляет классами и элементами групп и полезными способами манипулирует DOM, что значительно упрощает реализацию реальных визуальных переходов.
1
ответ
Реактивная группа перехода и анимации
Проблема в том, что у меня есть форма с тремя состояниями: по умолчанию, ошибка и успех. В зависимости от состояния, конкретный компонент отображается в DOM. Мне нужно добавить анимацию постепенного исчезновения, когда этот компонент входит или выхо…
22 янв '18 в 00:47
1
ответ
Впервые использую React-Transition-Group
У меня есть компонент просмотра изображений, как одно большое изображение и 3 меньших под ним. Когда вы наводите курсор на одно из нижних изображений, оно меняет большое изображение на соответствующее изображение. Я хотел бы добавить переход постепе…
02 май '18 в 21:44
0
ответов
Предоставление анимации компонента React при монтировании
Я пытаюсь заставить этот компонент двигаться при подключении, но получаю Cannot read property 'enter' of undefined Вот упрощенный код (у меня есть все готовые классы CSS): class Example extends React.Component { state = { transitionIn: false, }; com…
27 авг '18 в 10:28
1
ответ
Маршрутный анимационный переход с React Transition Group v2
Как я могу анимировать дочерние узлы при входе с использованием response-transition-g roup-v2 и response-router-v4? Например, у нас есть компонент About, который включает в себя 3 дочерних узла div. class About extends React.Component { render() { r…
23 окт '17 в 10:29
0
ответов
Коммутатор React-router с TransitionGroup 2.2.0 не применяет правильный переход (стили)
У меня проблема, аналогичная той, о которой сообщалось здесь: https://github.com/ReactTraining/react-router/issues/5279 Я следую той же идее. Мне нужно смоделировать стиль навигации, как в мобильных устройствах (экраны / компоненты перемещаются спра…
01 ноя '17 в 20:28
1
ответ
Пользовательский интерфейс материала: ошибка с группой реагирования перехода v 2.2.0
Я использую <Transition> как объяснено в основной документации React Transition Group. import React from 'react'; import PropTypes from 'prop-types'; import Transition from 'react-transition-group/Transition'; const defaultStyle = { transition…
09 авг '17 в 13:42
2
ответа
Как передать состояние родительскому компоненту при щелчке на ссылке "Реакция-маршрутизатор"?
Я хочу создать одностраничное приложение, которое работает с переходами, которое будет выглядеть следующим образом: *------*--------------*-----------* | | | | | Shop | Landing Page | Biography | | | | | *------*--------------*-----------* | | | Con…
15 июн '18 в 12:55
0
ответов
Реагировать на ширину <CSSTransition> таким же уникальным компонентом <Route>
Я разработал свое портфолио с новым инструментом для меня: React. Я пытаюсь сделать переход входа и выхода из страницы projectDetails Итак, у меня есть список моего проекта, и когда я нажимаю, я хочу, например, постепенное появление, а когда я выбир…
29 апр '18 в 12:54
0
ответов
Fade in transition не работает с помощью responsejs transitiongroup
Мне нужна помощь, потому что я не могу понять, что я делаю неправильно... Ниже приведен мой метод рендеринга из моего компонента и используемого CSS. То, что я пытаюсь сделать, пока пользователь не аутентифицирован, чтобы увидеть заставку вместо мар…
08 окт '18 в 00:36
0
ответов
Как написать собственную анимацию, используя React Transition Group
Я новичок в реакции, пытаясь использовать версию 2.3.1. Пытаясь добиться анимированных элементов списка. Кажется, анимация не работает, перепробовал много примеров документации, но не смог достичь. Планирование добиться чего-то вроде этого: пример В…
07 июн '18 в 11:26
1
ответ
React Transition Group предотвращает переход на изменение параметров
Мое приложение использует "response-transition-group" для маршрутизации между страницами, но каждый раз, когда обновляется идентификатор моего портфолио, оно перерисовывает весь компонент и запускает анимацию перехода. Как я могу сделать так, чтобы …
05 янв '19 в 03:10
0
ответов
Анимация строк в / из таблицы с помощью React Transition Group
Цель В настоящее время я пытаюсь использовать React-Transition-Group для анимации строк таблицы. Возможны два разных сценария: все содержимое таблицы будет выгружено (наиболее распространенный вариант) отдельные строки могут быть добавлены и удалены…
09 янв '19 в 16:28
0
ответов
Как использовать response-router и иметь разные типы анимаций (или их нет) с response-transition-group
Я использовал собственный пример анимации в React Router в качестве отправной точки и получил простую и всегда появляющуюся анимацию. Проблема в том, что установка слишком упрощена, и мне требуется что-либо от отсутствия перехода до произвольного ко…
22 янв '19 в 17:39
1
ответ
Реагировать на неправильный класс CSSTransition, используемый при выходе
ОБНОВИТЬ: Для тех, кто сталкивается с той же проблемой: я нашел похожую проблему, размещенную на git-странице ReactTransitionGroup с решением там: https://github.com/reactjs/react-transition-group/issues/182. Честно говоря, 90% решений взорвалось пр…
07 фев '18 в 02:52
1
ответ
Анимированная группа реакции-перехода с помощью ReactDOM createPortal
Я ломал голову, пытаясь понять, как сделать что-то, что я решил, было бы довольно просто (я знаю...) Цель состоит в том, чтобы создать минимальный и многократно используемый модальный компонент, который я могу анимировать в каком-то HOC с помощью кн…
13 фев '19 в 14:39
1
ответ
"TS7017: элемент неявно имеет тип" любой "... не имеет подписи индекса", когда я использую реагирующую группу
Вот мой код: renderSoundWave = () => { const defaultStyle = { opacity: 1, transition: `opacity ${DURATION}ms ease-in-out`, } const transitionStyles = { entering: { opacity: 1 }, entered: { opacity: 0 }, }; return ( <Transition timeout={DURATIO…
18 фев '19 в 13:42
0
ответов
Компонент, не размонтированный с реакционно-переходной группой и стилизованными компонентами
У меня есть компонент, который оживляет с react-transition-group вот так: import { CSSTransition } from 'react-transition-group'; //.... const popoverWindow = 'popover-window' <CSSTransition in={popoverVisible} classNames={popoverWindow} unmountO…
27 фев '19 в 20:33
1
ответ
React Router Transition с макетом Аккордеон
Я перестраиваю свой сайт с помощью React. Я столкнулся с проблемой с реагировать маршрутизатор и реагировать переходной группы. В документации по реагирующему маршрутизатору есть руководство по созданию анимированных переходов. Но он привязан к опре…
27 фев '19 в 11:22
0
ответов
React CSS Transition не показывает анимацию
В настоящее время я изучаю реакции и переходы по некоторым причинам, и приведенные здесь примеры и другие вопросы не будут работать для меня. Я просто хочу создать легкий эффект затухания, и даже если я скопирую такой пример, он не сработает. Я созд…
01 мар '19 в 07:19
0
ответов
Реагирующая группа переходов добавляет элементы при переходе, поэтому css перерывы сетки
Группа React transition генерирует элементы в DOM, которые разрушают мою сетку CSS, пока исчезают. Сетка имеет 6 ячеек и не может иметь больше. Код переходной группы const transitionsNames = { enter: classes["animation-enter"], enterActive: classes[…
13 фев '19 в 19:09