Fix transition group
This commit is contained in:
parent
b46206de1f
commit
63bae9fc55
@ -1,4 +1,5 @@
|
|||||||
import CSSTransition from 'react-transition-group/CSSTransition'
|
import CSSTransition from 'react-transition-group/CSSTransition'
|
||||||
|
import TransitionGroup from 'react-transition-group/TransitionGroup'
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import classnames from 'classnames'
|
import classnames from 'classnames'
|
||||||
import { Notification } from '../actions/NotifyActions'
|
import { Notification } from '../actions/NotifyActions'
|
||||||
@ -22,19 +23,21 @@ extends React.PureComponent<NotificationProps> {
|
|||||||
const { notifications, max } = this.props
|
const { notifications, max } = this.props
|
||||||
return (
|
return (
|
||||||
<div className="notifications">
|
<div className="notifications">
|
||||||
{Object.keys(notifications).slice(-max).map(id => (
|
<TransitionGroup>
|
||||||
<CSSTransition
|
{Object.keys(notifications).slice(-max).map(id => (
|
||||||
key={id}
|
<CSSTransition
|
||||||
classNames='fade'
|
key={id}
|
||||||
timeout={transitionTimeout}
|
classNames='fade'
|
||||||
>
|
timeout={transitionTimeout}
|
||||||
<div
|
|
||||||
className={classnames(notifications[id].type, 'notification')}
|
|
||||||
>
|
>
|
||||||
{notifications[id].message}
|
<div
|
||||||
</div>
|
className={classnames(notifications[id].type, 'notification')}
|
||||||
</CSSTransition>
|
>
|
||||||
))}
|
{notifications[id].message}
|
||||||
|
</div>
|
||||||
|
</CSSTransition>
|
||||||
|
))}
|
||||||
|
</TransitionGroup>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user