## rate
保险师平台用户评分组件(5级评分)。允许显示小数，但change事件取值只能为整数值，建议在只读状态下使用。

修改(2019.09.30)：  
竖版评分：新增评分值展示、标签选择  
横版：新增标题、评分值  

## Import
```js
import { Rate } from 'bxs-ui-vue';
export default {
  components: {
    [Rate.name]: Rate
  }
}
```
或者
```js
import Vue from 'vue'
import { Rate } from 'bxs-ui-vue'
Vue.use(Rate);
```

## Example
``` html
//默认(零配置)
<bxs-rate />

//默认(竖版完整)
<bxs-rate
  :value="2"
  :text-list="['非常差1', '差2', '一般3', '好4', '非常好5']"
  :tag="1"
  :tag-list="['服务好1', '速度快2', '效率高3']"
/>

//change事件 & 默认标签
<bxs-rate 
  :value="3.3" 
  :tag-list="true"
  @change="getReturnValue"
/>

//指定评分 + 自定义文案 + 字体大小
<bxs-rate 
  v-model="value" 
  size="1.19rem"
  :tag-list="true"
  :text-list="textList"
/>

//自定义颜色 & 只读(不可点击)
<bxs-rate 
  v-model="value" 
  color="#0dd" 
  void-color="#cefbfd"
  readonly
/>

//文案居右 & 显示标题
<bxs-rate 
  v-model="value" 
  position="right" 
  rate-label="整体评价:"
/>

//文案居右(只读) & icon大小 & 不展示评分
<bxs-rate 
  v-model="value" 
  position="right" 
  :readonly="true" 
  star-size="12px"
  star-width="90px"
  :show-rate-num="false"
/>
```

```js
export default {
  data() {
    return {
      value: 3.3,
      textList: [
        '自定义文案一',
        '自定义文案二',
        '自定义文案三',
        '自定义文案四',
        '自定义文案五',
      ],
    }
  },
  methods: {
    getReturnValue(value, tag) {
      this.$toast(`当前选中值：评分=${value}; 标签=${tag}}`)
    },
    onlyReadMessage() {
      this.$toast(`只读状态，不阻止事件冒泡`)
    }
  }
}
```
## Attribute
| 参数| 说明 | 类型 | 默认值 |
| --- | --- | --- |  --- |
|v-model|当前分值，允许传小数|Number|-|
|text-list|可选，评分对应的文案。传空数组表示不需要文案说明；数组只有一个子元素，表示为固定文案|Array|['非常差', '差', '一般', '好' ,'非常好']|
|size|可选，图标大小。可带单位，默认单位px|String|30px (position='right'，默认18px)|
|position|可选，文本位置，可选值`bottom` `right`|String|bottom|
|color|可选，选中时的颜色|String|#FF9224|
|void-color|可选，未选中时的颜色|String|#E5E5E5|
|readonly|可选，是否为只读状态|Boolean|false|
|tag|可选，选中的标签|Number|null| 
|tag-list|可选，布尔值为是否显示标签，数组为自定义标签内容。值为true,标签数组默认为['服务好', '速度快', '效率高']|Boolean，Array|false| 
|star-width|可选，icon部分的宽度，只对position='right'类型的有效。可传css支持的width值|String|114px| 
|star-size|可选，icon字体大小，只对position='right'类型的有效。不传，icon大小取上面【size】参数的值）|String|''| 
|rate-label|可选，标题内容，只对position='right'类型的有效|String|''| 
|show-rate-num|可选，是否显示评分|Boolean|true| 



### Slot
无

### Event
| 事件名称 | 说明 | 回调参数 |
| --- | --- | --- |
| change | 当前分值/标签变化时触发的事件。分值可不选，选择后不能小于1;标签是单选，可以取消 | 当前分值(整数值),当前标签值(整数值)。没有选择值的传null |

### 设备兼容
联想(白色)  08-201600-021
三星(黑色)
三星(白色) 08-201600-016

| 机型 | 系统版本 | 兼容情况 |  
| --- | --- | --- |  
| oppo R9(08-201600-046) | 5.1 | ✓  |  
| oppo R7s(08-201600-031) | 4.4.4 |滑动不流畅  |  
| vivo Y85A | 8.1.0 | ✓ |  
| vivo Y85A | 4.4.4 | 滑动不流畅 |  
| 小米(灰,08-201703-191) | - | ✓ |  
| 华为 麦芒4 | 6.0.1 | ✓|  
| 华为 Mate8 | 8.0.0 | ✓|  
| oppo R11 | 7.11 | - | ✓|  
| iPhone 6(08-201612-148) | 12.4 | ✓ |  
| iPhone SE(08-201600-036) | 11.1.2 | ✓ |  
| iPhone 5C(黄,08-201600-065) | 10.3.3 | ✓ |  
| iPhone XS MAX(SJ0002) | 12.1.2 | ✓ |  
| iPhone 6P | 11.4.1 | ✓ |  
| iPhone 11 Pro | 13.0 | ✓ |  
| iPhone 8 Plus | 11.3 | ✓ |  
