mui 多个进度条

$4614@.com
其实这个很简单,只是苦于自己当时对mui并不熟悉,所以绕了很大的坑,下面贴出代码!

1.文档结构代码

<div id="app"> <ul id="demo"> <li v-for="(item,index) in items"> <p class="mui-progressbar mui-progressbar-in" :data-progress="item.num"><span></span></p> </li> </ul> </div>

2.JS 代码

window.οnlοad=function(){

 new Vue({ 

 el:"#app",

 data:{ 

 items:[ {num:10}, {num:20}, {num:30}, {num:40} ]

 }

 })

 mui('#demo .mui-progressbar').each(function(){ mui(this).progressbar({progress:this.getAttribute("data-progress")}).show(); }) }

注意:在写的时候 一定要确定#demo .mui-progressbar上面有data-progress 这个属性,不然是不起作用的.

转载于:https://juejin.im/post/5bfc070cf265da61542d4f0a