微信小程序五星级评分效果

<view>
    <view class="zan-font-16 my-ib" bindtap="myStarChoose">
        <block wx:for="{{starMap}}">
            <text wx:if="{{star>=index+1}}" style="padding-right: .5em" class="zan-c-red" data-star="{{index+1}}">★</text>
            <text wx:if="{{star<index+1}}" style="padding-right: .5em" class="zan-c-gray-dark" data-star="{{index+1}}">☆</text>
        </block>
    </view>
    <!--★-->
    <text class="zan-c-gray-dark">{{starMap[star-1]}}</text>
</view>

这里的zan-font-16,zan-c-red,zan-c-gray-darkZanUI-WeApp的样式。
这里的my-ib只是将设置displayinline-block

Page({
    data: {
        star: 0,
        starMap: [
            '非常差',
            '差',
            '一般',
            '好',
            '非常好',
        ],
    },
    myStarChoose(e) {
        let star = parseInt(e.target.dataset.star) || 0;
        this.setData({
            star: star,
        });
    }
});

效果如图:

clipboard.png


王道中强流
不为繁华易匠心

在福州“土生土长”的 1986 年老程序员一枚,专注 Web 技术三十年。

1.7k 声望
44 粉丝
0 条评论
推荐阅读
Linux自动备份MySQL
首先找到你的MySQL配置文件my.cnf {代码...} 然后修改它, {代码...} 在[client]里增加三行: {代码...} 本来不需要这些操作,直接把用户名密码写到备份脚本里就可以,但是 MySQL 5.6 之后在命令行里写密码会出现...

王道中强流阅读 1.9k

简单实现微信小程序支付+php后端(回调、查询订单、订单信息入库)
微信小程序获取订单参数-&gt;向后端发起同意下单请求-&gt;获取订单参数-&gt;小程序调用Api进行发起支付-&gt;支付完成-&gt;发送回调-&gt;支付结果入库-&gt;查询订单支付状态。

TANKING1阅读 1.9k

微信小程序开发--个性化头像生成(国庆渐变头像、圣诞帽头像)
今年国庆 渐变头像着实火了一把,看到微信里面的好友,很多都换上了新颜。 如上图所示,一个渐变的头像。作为码农,看到上面的效果,首先会想到这个是怎么实现的?我可不可以?于是就有了今天这篇文章,记录一下...

caiandroidDev阅读 2.1k

快来解锁小程序蓝牙开发技能
微信小程序中很早就支持了蓝牙能力,看过不少的文档,知道大概的流程和能实现的效果,但是由于一直没有像样的实战项目导致也没有正经的开发上线过,本次缘于接到了一个外包项目,那就顺道记录一下开发的过程及遇...

南城FE2阅读 444

封面图
微信小程序-获取用户头像信息以及修改用户头像
这里主要用到button的open-type功能,官网已有说明:给button设置open-type=&quot;chooseAvatar&quot;,来使bindchooseavatar方法生效,在bindchooseavatar指定的函数中获取用户的头像信息

兔子先森阅读 705

微信小程序自定义tabbar图标切换点击两次才选中解决方法
微信小程序开发过程中使用了自定义tabBar,运行官网提供的demo是没有问题的,但是自己添加了新的tab-item后点击会出现错误,具体表现为:点击一次tab跳到指定的页面,但是tabBar的状态还停留在上一个,再次点击才...

来了老弟阅读 660

微信小程序的全局弹窗以及全局实例
微信小程序组件关系中,父组件使用子组件需要在父组件index.json中引入子组件,然后在父组件页面中使用,这种组件的对应状态是一对一的,一个组件对应一个页面。如果有一个全局弹窗(登录),那么每个页面引入一...

兔子先森阅读 593

在福州“土生土长”的 1986 年老程序员一枚,专注 Web 技术三十年。

1.7k 声望
44 粉丝
宣传栏