vue插件 环形进度条动画效果

1:首先安装插件 cnpm install vue-circleprogressbar

<template> 
	 <div class="wrap-progress">
	        <circle-progressbar 
	        	:id="1" 
	        	barColor="#0000ff" 
	         	backgroundColor="rgba(0,0,0,0.4)" 
	        	:width="100" 
	        	:radius="10" 
	        	:progress="progress"
	          :isAnimation="false"></circle-progressbar>
	      </div>
</template>

<script>
 import circleProgressbar from 'vue-circleprogressbar';
  export default {
      
	//组件引用
    components: {
     
      circleProgressbar
    },
    data(){
     
    	return {
     
			progress: 40,
		}
    }
}
</script>

说明：
id:String 选填 多次定义设置不同的值
width:Number 必填 设置圆整体的大小
radius:Number 必填 设置进度条的宽度
progress:Number 必填 设置进度百分比
barColor:String 必填 设置进度条颜色
backgroundColor:String 必填 设置进度条北京颜色
delay:Number 选填 延时多久执行 单位为ms
duration:Number 选填 动画整体时常 单位为ms
timeFunction:String 选填 动画缓动算法
isAnimation:Boolean 选填 是否以动画的方式呈现