vue封装一个序列帧组件

在项目中实现一个简单的几秒动画，图片较小的话可以采用雪碧图的图片形式，结合css3的动画实现
雪碧图形式大概实现思路如下：

animation: lightning 3s steps(25) infinite;
animation-direction:alternate;


 @keyframes lightning {
    0%{
        background-position-y: 0;
    }
    100%{
        background-position-y: -1500px;
    }
  }

可是还有一种情况是图片很大，设计会按照帧率要求生成一套图，实现思路就像小时候看书角漫画一样：
首先封装一个img-animation.vue公用组件

然后在父元素中引入

import ImgAnimation from '../../components/common/base/animation'
const carContext1 = require.context('../../assets/images/left/wuliu', false, /\.png$/) // 引用文件

export default {
  name: '',
  components: {
    ImgAnimation 
  },
  computed: {},
  props: { },
  watch: { },
  data () {
  	return {
  		loadingList1: carContext1.keys().map(carContext1),
  	}
  }
}