Правильный способ использования ReactCSSTransitionGroup?

Question

Я пытаюсь внедрить простой CSS, затухающий для страниц, и мне нужно добавить тонну реквизита тайм-аута, чтобы избежать ошибок в консоли Ошибки PropType. В нем говорится, что что-то об этом не поддерживается в будущих версиях React.

Любые мысли?

<ReactCSSTransitionGroup 
    transitionName="pagefade" 
    transitionAppear={true} 
    transitionEnterTimeout={500} 
    transitionAppearTimeout={500} 
    transitionLeaveTimeout={500} 
> 

Answer 1

Предполагается предоставить эти реквизиты тайм-аута по мере необходимости, чтобы Реагировать, чтобы правильно справиться с продолжительностью перехода.

См. Здесь: https://github.com/facebook/react/blob/master/src/addons/transitions/ReactCSSTransitionGroup.js#L29 они предупреждают вас, что эти таймауты стали необходимыми, в то время как они были необязательными раньше.

Мое понимание заключается в том, что нет надежного способа правильно синхронизировать монтирование/размонтирование узлов DOM с периодами перехода, которые вы указываете в своем CSS.

Например, представьте, что вы хотите, чтобы ваш элемент исчезал перед размонтированием. Вы хотите, чтобы переход непрозрачности был полностью завершен до того, как React действительно удалит узел DOM для вас, иначе анимация будет вырезана. Поэтому вам нужно сказать, что явным образом отреагирую на продолжительность вашей анимации, потому что, возможно, слишком сложно или ненадежно для React попробовать и угадать эту продолжительность для вас (как они поняли в самых последних версиях).