在React中使用velocity.js动画

Question

我可以在React组件中使用velocity.js动画而无需在没有速度反应库的情况下进行集成吗？我不喜欢默认情况下,当安装组件时,会显示动画的最终状态.如何让动画在组件加载上运行？

Answer 1

简单的例子:

1. 进口速度

   import Velocity from 'velocity-animate';
   

2. 然后在componentDidMount中开始动画

   import React, { Component } from 'react';
   class VelocityExample extends Component {
       componentDidMount(){
            Velocity(this.refs.block,{ scale: 2 },500)
            .then(e=>console.log('animation complete'))
       }
       render(){
           return <div ref="block" >VelocityExample</div>;
       }
   }