Can i use velocity.js animations within React ponents without integrating it without velocity-react library ? I don't like that by default, when the ponent is mounted, the final state of the animation is shown. How can i make animation to run on ponent load ?

Can i use velocity.js animations within React ponents without integrating it without velocity-react library ? I don't like that by default, when the ponent is mounted, the final state of the animation is shown. How can i make animation to run on ponent load ?

• javascript
• animation
• reactjs
• velocity.js

Share Improve this question Follow edited Sep 2, 2016 at 11:38 Ivica Obadic asked Sep 2, 2016 at 11:02 Ivica ObadicIvica Obadic 7511 silver badge1010 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

simple example:

1. import velocity

   import Velocity from 'velocity-animate';
   

2. then start animation in ponentDidMount

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