react中引入jquery和animate.css

1、引入jquery

yarn add jquery --save-dev

import $ from 'jquery'

 render() {
        return (
            <div>
                <h1 className="h1" onClick={()=>{
                    $('.h1').html('哈哈哈')
                }}>這是page1頁面組件</h1>

            </div>
        )
    }

這樣就可以使用了。

2、引入animate.css

yarn add animate.css --save-dev

import 'animate.css'

<h1 className="h1 animated bounce" onClick={()=>{
                    $('.h1').html('哈哈哈')
                }}>這是page1頁面組件</h1>

這樣就可以使用，通常點擊某個按鈕進行添加動畫可以這樣實現：

 <h1 className="h1 animated" ref="h1" onClick={()=>{
                    $('.h1').html('哈哈哈')
                    let _this = this;
                    this.refs.h1.classList.add('bounce');
                    setTimeout(()=>{
                        _this.refs.h1.classList.remove('bounce');
                    },2000)
                }}>這是page1頁面組件</h1>