React, как сделать правильно анимацию slideDown?

Question

[Сергей Алексеев]

Настраиваю анимацию выпадающего списка с помощью ReactCSSTransitionGroup. То есть по нажатию на элемент появляется список.

<ReactCSSTransitionGroup
                        transitionName="anim"
                        transitionAppear={true}
                        transitionAppearTimeout={1000}
                        transitionEnter={false}
                        transitionLeave={false}
                    >
                        { this.props.shows[this.props.projectId] ?

                            <div className="projli__content">
                                <div className="projli__content-collapse collapse show" id="mpCollapse1">
                                    <div className="clearfix">
                                        <div className="projli__content-in">

                                            <ListSequenceContainer  projectId={this.props.projectId} />

                                        </div>
                                    </div>
                                </div>
                                <div className="projli__footer">
                                    <div className="projli__nav">
                                        <button className="btn btn-sm btn-indigo" onClick={this.showTypeAsset}>
                                            + asset
                                        </button>
                                    </div>
                                </div>
                            </div>

                        : ""}
                    </ReactCSSTransitionGroup>

Но имеется проблема, так как у элементов списка есть другой выпадающий список. Вопрос: как сделать чтобы анимация действовала только для верхнего списка?

Comments

[Павел Антонов]

я юзаю вот это react-collapse удобно и быстро