vue实现进度条

以前用jquery切图的时候就很好奇进度条要怎么写，一直没机会写。最近公司项目里面有个文件上传显示进度条的功能，用vue实现了一下，发现数据绑定作用下，进度条很简单就可以实现了。下面上代码

<div id="app">
	<button @click='start'>start</button>
	<div class="progress_wrapper">
		<div class="progress" :style='{width:`${percentage}%`}'>{{percentage}}%</div>
	</div>
</div>
<script type="text/javascript">
	var app =new Vue({
		el:'#app',
		data:{
			percentage:0,
		},
		methods:{
			start(){
				setInterval(()=>{
					if (this.percentage<100) {
						this.percentage +=1;
					}
				},100)
			}
		}
	})
</script>

您可以点击这里看demo