小编Vim*_*nan的帖子

我创建了一个react组件,它由slideUp()和slideDown()动画组成.我已经实现了使用jQuery slideup和slidedown方法.

我必须使用反应动画来实现此功能.

我读到了ReactTransitionGroup和ReactCSSTransitionGroup.解释的方式告诉我,当DomNode安装到组件或卸载时我们可以执行此功能(如果我错了,请纠正我).

我的问题是 - >如何以反应方式执行slideup()和slidedown()而不使用jQuery.

请参阅此jsFiddle for https://jsfiddle.net/guc3yrm1/

PS - >请解释一下,为什么这个反应动画部分看起来有点难以与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> …