feat(Rating): support custom display of rating grade

Author: jinchanz

docs/rating/demo/grade.md

@@ -17,5 +17,18 @@ Rating component display grade tips when you set  `showGrade` attribute.
 ````jsx
 import { Rating } from '@alifd/next';
 
-ReactDOM.render(<Rating defaultValue={2} showGrade />, mountNode);
+const starMap = {
+    1: 'Bad',
+    2: 'OK',
+    3: 'Good',
+    4: 'Great',
+    5: 'Perfect'
+};
+
+ReactDOM.render(
+    <Rating 
+        defaultValue={2} 
+        showGrade
+        readAs={(val) => starMap[val]} 
+    />, mountNode);
 ````

docs/rating/index.en-us.md

@@ -26,4 +26,4 @@ Rating component is usually used for customer feedback.
 | onChange     | callback function on click star<br><br>**signatures**:<br>Function(value: String) => void<br>**params**:<br>_value_: {String} score | Function | func.noop |
 | onHoverChange     | callback function on hover star<br><br>**signatures**:<br>Function(value: String) => void<br>**params**:<br>_value_: {String} score | Function | func.noop |
 | disabled     | disabled rate or not                                                                                               | Boolean  | false     |
-| readAs        | make sense when you set id and enable accessibility<br><br>**signatures**:<br>Function() => void                                                | Function | val => val |
+| readAs        | custom display of grade<br><br>**signatures**:<br>Function() => void                                                | Function | val => val |

docs/rating/index.md

@@ -26,4 +26,4 @@
 | onChange      | 用户点击评分时触发的回调<br><br>**签名**:<br>Function(value: String) => void<br>**参数**:<br>_value_: {String} 评分值    | Function | func.noop  |
 | onHoverChange | 用户hover评分时触发的回调<br><br>**签名**:<br>Function(value: String) => void<br>**参数**:<br>_value_: {String} 评分值 | Function | func.noop  |
 | disabled      | 是否禁用                                                                                                  | Boolean  | false      |
-| readAs        | 传入id支持无障碍时，参数才有意义<br><br>**签名**:<br>Function() => void                                                | Function | val => val |
+| readAs        | 评分文案生成方法，传入id支持无障碍时，读屏软件可读<br><br>**签名**:<br>Function() => void                                       | Function | val => val |

src/rating/rating.jsx

@@ -58,7 +58,7 @@ export default class Rating extends Component {
          */
         disabled: PropTypes.bool,
         /**
-         * 传入id支持无障碍时，参数才有意义
+         * 评分文案生成方法，传入id支持无障碍时，读屏软件可读
          */
         readAs: PropTypes.func,
         // 实验属性: 自定义评分icon
@@ -374,7 +374,7 @@ export default class Rating extends Component {
                     </div>
                 </div>
                 {
-                    showGrade ? <div className={`${prefix}rating-info`} style={infoStyle}>{value}</div> : null
+                    showGrade ? <div className={`${prefix}rating-info`} style={infoStyle}>{readAs(value)}</div> : null
                 }
             </div>
         );