React tutorial1-11

animate

by catfood

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.1/react-with-addons.js"></script>
<div id="content"></div>
<script type="text/babel">
console.log(React)
const CSSTransitionGroup = React.addons.CSSTransitionGroup;
class AnimateSample extends React.Component {
  handleClick(e){
    this.setState({
      num: this.state.num + 1
    });
  }
	render(){
  	return (
    	<div>
				 <div class="anime">anime</div>
      	 <button onClick={this.handleClick.bind(this)}>click</button>
       </div>
    )
  }
}
React.render(
  <AnimateSample/>,
  document.getElementById('content')
);
</script>

CSS

.anime{
	width:100px;
	height:100px;
	background:red;
}