antd pro 使用 wowjs 动画

官方文档

animate.css
WOW

安装

 npm i wowjs --save
 # 笔者当前版本 1.1.3
 # 依 animate.css版本  4.1.1

引入animate.css

global.less引入:

@import '~animate.css/animate.min.css';

组件加入动画

index.jsx

// 依赖
import {
    
     WOW } from 'wowjs';


 // 初始化
  componentDidMount() {
    
    
    new WOW({
    
    
      offset: 0,
      boxClass: 'wow',
      animateClass: 'animate__animated', //当前版本animate.css,class名称为animate__animated，注意修改【和文档有出入】
      mobile: true,
      live: false,
    }).init();
  }

//使用 注意当前版本命名规则 animate__fadeInDown ,查阅animate.css官网 
<div className="wow animate__fadeInDown" data-wow-duration="1s" data-wow-delay="0.5s">
	测试下
</div>