自定义评分组件，不止于1星、半星，精确到0.1星。

自定义评分组件 
实现思路

星星分两种形态，一种代表实心评分，一种代表空心未评分。实星和空星完全重叠，大小必需保持一致，实星叠于空星之上，根据评分设置实星的宽来显示评分。 
全五星代表10分，一颗星就是2分，精确到0.1，一颗星就分为20份。

源码

rating.wxml

 name="rating">
  
     class='rating-on' 
      style='width:{{rating >= 2 ? 1 : rating*10%20/20}}em'
    >
     class='rating-off'>
  
  
     class='rating-on' 
      style='width:{{rating >= 4 ? 1 : rating < 2 ? 0 : rating*10%20/20}}em'
    >
     class='rating-off'>
  
  
     class='rating-on' 
      style='width:{{rating >= 6 ? 1 : rating < 4 ? 0 : rating*10%20/20}}em'
    >
     class='rating-off'>
  
  
     class='rating-on' 
      style='width:{{rating >= 8 ? 1 : rating < 6 ? 0 : rating*10%20/20}}em'
    >
     class='rating-off'>
  
  
    
      style='width:{{rating == 10 ? 1 : rating < 8 ? 0 : rating*10%20/20}}em'
    >
     class='rating-off'>
  

rating.wxss

.rating-on {
  color: black;
  position: absolute;
  overflow: hidden;
}
.rating-off {
  color: #DBDBDB;
}
.rating-on:not(:last-child),
.rating-off:not(:last-child) {
  margin-right: 0.2em;
}

使用

page.wxml

 src='../common/rating/rating.wxml' />
 is='rating' data='{{rating:rating.average}}' />

page.wxss

@import '../common/rating/rating';

我使用的特殊符号，也可使用图片，保证尺寸一致就行。评分组件实现方式很多，我也许是初学，若有更佳实现方式请赐教。