vue 拼接序列图为gif动画

<div class="gif">
	<img :src="gif" />
</div>

export default{
		data(){
			return{
				gif:'',
				imgs:[
				'cardGif (1)','cardGif (2)','cardGif (3)','cardGif (4)','cardGif (5)','cardGif (6)','cardGif (7)','cardGif (8)','cardGif (9)','cardGif (10)'
				]
			}
		}
		mounted(){
			this.size=this.imgs.length;
			this.i=0;
			var that=this;
			this.tim = setInterval(function() {
	          that.chImg()
	        }, 100)
			
		}
		methods:{
			chImg(){				
				if(this.i>=this.size){
					clearInterval(this.tim)
				}else{		
					this.gif=require(`@/assets/images/cardGif/${this.imgs[this.i]}.png`)
					this.i++;
				}
			}
		}
	}