Я создал компонент реагирования, который состоит из анимации slideUp () и slideDown (). Я реализовал с помощью методов jQuery slideup и slidingown.

Я должен реализовать эту функцию, используя реакцию анимации.

Я читаю оReactTransitionGroup а такжеReactCSSTransitionGroup, Способ объяснения научил меня, мы можем сделать эту функцию, когдаDOMNode подключен к компоненту или демонтирован (поправьте меня, если я не прав).

Мой вопрос -> как сделать slideup () и slidedown () реагирующим образом и без использования jQuery.

Смотрите это jsFiddle дляhttps://jsfiddle.net/guc3yrm1/

P.S -> Пожалуйста, объясните мне, почему эта часть анимации реагирования кажется немного трудной, если сравнивать с jQuery (я парень из jQuery)

var Hello = React.createClass({
    getInitialState: function() {
        return {
            slide: false,
        }
    },
    slide: function() {
        if (this.state.slide) {
            $(this.refs.slide).slideDown();
            this.setState({
                slide: false
            });
        } else {
            $(this.refs.slide).slideUp();
            this.setState({
                slide: true
            });
        }
    },
    render: function() {
        return ( 
            <div>
                <input type = "button" value = "clickme" onClick = {this.slide}/> 
                <br />
                <br />
                <div className = "slide" ref="slide" >< /div>
            </div>
        );
    }
});

ReactDOM.render( < Hello name = "World" / > ,
    document.getElementById('container')
);