uni 不使用插件的情况下写的动态进度条

1，

2，html

<view class="data_title__39vye">
	<view class="data_progress__1PKMR">
		<view class="data_proLeft__1gtzQ" :style="{width:pressWidth}"></view>
	</view>
</view>

3, css

.data_progress__1PKMR{
			width: 100%;
			height:20rpx;
			margin-top: 10rpx;
			background: #067ee7;
			border-radius: 16rpx;
			overflow: hidden;
			.data_proLeft__1gtzQ{
				width: 55%;
				height: 100%;
				background: linear-gradient(-45deg,transparent 7px,#F15D5D 0);
				border-top-left-radius: 16rpx;
				border-bottom-left-radius:16rpx;
			}
		}

4，js 部分

export default {
	data(){
	   return{
	   		pressWidth: '0%',
	   }
	}
},
methods: {
			value: function(e) {
					this.pressWidth = '60%'
				}
			},
}