refactor(rate): turn into under controlled component

example/pages/rate/rate.wxml

@@ -5,7 +5,7 @@
     <view class="demo-section__desc">实心评分</view>
     <view class="item">
       <view class="item__title">请点击评分</view>
-      <t-rate value="{{value[0]}}" data-index="{{0}}" variant="filled" bind:change="onChange" />
+      <t-rate value="{{value[0]}}" data-index="{{0}}" variant="filled" />
     </view>
 
     <view class="demo-section__desc">空心评分</view>

src/rate/README.md

@@ -24,9 +24,26 @@ isComponent: true
 <img src="https://tdesign.gtimg.com/miniprogram/readme/rate.png" width="375px" height="50%">
 
 ```html
-<t-rate size="{{48}}" value="{{3}}" variant="filled" bind:change="onChange"></t-rate>
+<t-rate defaultValue="{{value}}" variant="filled"></t-rate>
 ```
 
+### 受控用法
+
+```html
+<t-rate value="{{value}}" variant="filled" bind:change="onChange"></t-rate>
+```
+
+```js
+Page({
+  data: {
+    value: 3
+  },
+  onChange(e) {
+    const { value } = e.detail;
+    this.setData({ value })
+  }
+})
+```
 ## API
 
 ### Rate Props
@@ -41,7 +58,8 @@ isComponent: true
 | showText   | Boolean | false   | 是否显示辅助文字                                                                                                                                                          | N    |
 | size       | String  | 40      | 评分图标的大小                                                                                                                                                            | N    |
 | texts      | Array   | -       | 自定义评分等级对应的辅助文字，组件内部默认为：['极差', '失望', '一般', '满意', '惊喜']。TS 类型：`Array<string>`                                                          | N    |
-| value      | Number  | -       | 选择评分的值                                                                                                                                                              | Y    |
+| value      | Number  | -       | 选择评分的值                                                                                                                                                              | N    |
+| defaultValue      | Number  | -       | （非受控）选择评分的值                                                                                                                                                              | N    |
 | variant    | String  | outline | 形状类型，有描边类型和填充类型两种。可选项：`outline`/`filled`                                                                                                            | N    |
 
 ### Rate Events

src/rate/props.ts

@@ -52,6 +52,11 @@ const props: TdRateProps = {
     type: Number,
     value: 0,
   },
+  /** 选择评分的值-非受控 */
+  defaultValue: {
+    type: null,
+    value: undefined,
+  },
   /** 形状类型，有描边类型和填充类型两种 */
   variant: {
     type: String,

src/rate/rate.ts

@@ -29,6 +29,13 @@ export default class Rate extends SuperComponent {
 
   properties = props;
 
+  controlledProps = [
+    {
+      key: 'value',
+      event: 'change',
+    },
+  ];
+
   data = {
     classPrefix: name,
     icon: 'star-filled',
@@ -58,7 +65,7 @@ export default class Rate extends SuperComponent {
           value = 0;
         }
         if (value !== currentValue) {
-          this.triggerEvent('change', { value });
+          this._trigger('change', { value });
         }
       })
       .exec();

src/rate/type.ts

@@ -76,6 +76,14 @@ export interface TdRateProps {
     type: NumberConstructor;
     value?: number;
   };
+  /**
+   * 选择评分的值-非受控
+   * @default 0
+   */
+  defaultValue: {
+    type: NumberConstructor;
+    value?: number;
+  };
   /**
    * 形状类型，有描边类型和填充类型两种
    * @default outline