在公司大部分是实现动画，今天分享一个特别好用的工具–SVGA

1.全局安装SVGA

npm install svgaplayerweb --save复制代码

2.在使用时引入安装包

import SVGA from 'svgaplayerweb';复制代码

3.设置Dom节点

    
复制代码

4.具体使用：

const svgUrl = '//yun.tuisnake.com/h5-mami/pluginAct/takePack1/cai1.svga';const player = new SVGA.Player('#demoCanvas');const parser = new SVGA.Parser('#demoCanvas'); // 如果你需要支持 IE6+，那么必须把同样的选择器传给 Parser。function animationInit() {  parser.load(svgUrl, function(videoItem) {    player.loops = 1;  设置循环播放次数是 1     player.setVideoItem(videoItem);    player.stepToFrame(0, true); // 从指定帧开始播放动画    player.onFrame((i) => {      console.log(i);   //。这里输入的是动画的帧数      if (i >= 24 && i < 26) {        console.log('111');      } else if (i >= 70) {        player.clear();      }    });  });};复制代码

5.常用参数说明

SVGA.Player 用于控制动画的播放和停止

SVGA.Parser 用于加载远端或 Base64 动画，并转换成 VideoItem。

loops; - 动画循环次数，默认值为 0，表示无限循环。

stepToFrame(frame: int, andPlay: Boolean); - 跳到指定帧，如果 andPlay === true，则在指定帧开始播放动画 clear(); - 强制清空画布

具体参数参考：https://github.com/yyued/SVGAPlayer-Web

End...