微信小程序之五星评分效果
自己写的Demo 数据是自己模拟的 希望下面的内容能够对大家有所帮助，不喜勿喷！
下面上代码
date 数据格式：
var dateList = [
{
userId: 0,
name: '王隔壁',
nameurl: '../img/user-1.png',
jdtype: 0,
bqurl: [1, 2, 3, 4],
money: 199,
startarr: [2, 2, 2, 2, 2],
start:5,
zyurl: '1,2,3',
orderid: '001'
},
{
userId: 1,
name: '李Lisa',
nameurl: '../img/user-2.png',
jdtype: 1,
bqurl: [1, 2],
money: 50,
startarr: [2, 2, 2, 1, 0],
start: 3.5,
zyurl: '1',
orderid: '001'
},
{
userId: 2,
name: '良辰',
nameurl: '../img/user-3.png',
jdtype: 3,
bqurl: [1, 2, 4],
money: 80,
startarr: [2,2,2,2,1],
start: 4.5,
zyurl: '2,3',
orderid: '001'
},
{
userId: 3,
name: '吉日',
nameurl: '../img/user-4.png',
jdtype: 2,
bqurl: [3],
money: 100,
startarr: [2, 0, 0, 0, 0],
start: 2,
zyurl: '1,2,3,4',
orderid: '001'
},
{
userId: 4,
name: '大王',
nameurl: '../img/user-5.png',
jdtype: 2,
bqurl: [1,2,3,4],
money: 99,
startarr: [2, 1, 0, 0, 0],
start: 1.5,
zyurl: '1,2',
orderid:'001'
}
]
module.exports = {
dateList: dateList //暴露给外部，不然不能获取
}
js文件
var dateList = require("../data/date.js"); //引入data.js
Page({
/**
* 页面的初始数据
*/
data: {
dataList:'',
titleurl: ['../img/grade/[email protected]', '../img/grade/[email protected]', '../img/grade/[email protected]', '../img/grade/[email protected]'],
kap: ["../img/grade/[email protected]", "../img/grade/[email protected]", "../img/grade/[email protected]"],
kapIndex:[],
stars:[]
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var kapind = dateList.dateList;
var arr = [];
for(var i=0;i*.wxml 文件
我这里把这个文件做成了模板
{{start}}
*.wxss 文件
自己去写吧 ！
来张效果图
剩下的就需要骚年们自己动手试验了！祝你们成功！