小程序实现投票进度条

2022-01-11,,

这篇文章主要为大家详细介绍了小程序实现投票进度条,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了小程序投票进度条的具体代码,供大家参考,具体内容如下

示例图:

上代码:

index.wxml:

  进度 {{width}}当前票数 {{quorumvotes}}

index.wxss

 .clo_jdt { width: 100%; border: 1px solid #6c9c2c; height: 25px; border-radius: 10px; } .clo_jdt view { background: #95ca0d; float: left; height: 100%; text-align: center; line-height: 150%; border-radius: 10px 0 0 10px; }

index.js

 Page({ data: { quorumvotes: 50,//当前票数 width: "0%",//投票进度 votes: 500 //最多可投票数 }, onLoad: function() { //获取总票数 var votes = this.data.votes; //获取当前票数 var quorumvotes = this.data.quorumvotes; //进度 var speed = quorumvotes/votes*100+"%"; console.log(speed) this.setData({ width: speed, }); })

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持本站。

以上就是小程序实现投票进度条的详细内容,更多请关注本站其它相关文章!

《小程序实现投票进度条.doc》

下载本文的Word格式文档,以方便收藏与打印。