好的
<view class=‘fullX line flexC’ wx:for=“{{percent}}”>
<view class=‘play’>{{item.grade}} : </view>
<progress backgroundColor=“rgba(0,0,0,0)” percent=“100” style=“width:{{item.width}}rpx” color=‘{{item.color}}’ stroke-width=“12” active />
</view>
.wx-progress-bar {
display: inline-block;
border-radius: 10rpx;
}
.wx-progress-inner-bar {
background-size: 9px 9px;
background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
border-radius: 10rpx;
}
progress {
width: 300rpx;
margin: 8rpx 20rpx 0 20rpx;
}
percent: [
{ width: 100, people: 0, grade: “初级”, color: “#f26420” },
{ width: 100, people: 0, grade: “二级”, color: “#ef2e35” },
{ width: 100, people: 0, grade: “三级”, color: “#fbba1b” },
{ width: 100, people: 0, grade: “四级”, color: “#4f308d” },
{ width: 100, people: 0, grade: “高级”, color: “#f86b2e” }
]