Maison > Article > Applet WeChat > Exemple de programme WeChat Mini pour obtenir une note de cinq étoiles
Cet article présente principalement des informations pertinentes sur les exemples de mise en œuvre du mini-programme WeChat cinq étoiles. Voici des exemples de mise en œuvre pour vous aider à mettre en œuvre la fonction modifiée. Les amis dans le besoin peuvent se référer au
Mini-programme WeChat cinq. -Note d'étoiles
Effet de note de cinq étoiles :
<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>
Ici zan-font-16,zan-c- red,zan-c-gray-dark est le style de ZanUI-WeApp.
Mon-ib ici définit simplement l'affichage sur le bloc en ligne.
Page({ data: { star: 0, starMap: [ '非常差', '差', '一般', '好', '非常好', ], }, myStarChoose(e) { let star = parseInt(e.target.dataset.star) || 0; this.setData({ star: star, }); } });
L'effet est le suivant :
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!