//
import React from 'react';
import lottie from 'lottie-web';
class MyLottie extends React.Component {
componentDidMount() {
this.renderLottie()
}
renderLottie() {
const { path } = this.props;
if (path) {
this.timer = setTimeout(() => {
this.lottie = lottie.loadAnimation({
container: document.getElementById('lottie'), //this.lottieRef, // the dom element that will contain the animation
renderer: 'svg',
loop: true,
autoplay: true,
path, // the path to the animation json
});
}, 300);
}
}
componentWillUnmount() {
if (this.lottie) {
this.lottie.destroy();
}
if (this.timer) {
clearTimeout(this.timer);
}
}
closeLottie() {
if (this.lottie) {
this.lottie.destroy();
}
}
testLog() {
console.log(this.state);
}
render() {
return (
(this.lottieRef = ref)}
id="lottie"
style={this.props.style || {}}
>
);
}
}
export default MyLottie;
MyLottie.defaultProps = {
path: ''
}