feat: 评分 事件

examples/components/EventAction/InputRatingEvent.jsx

@@ -0,0 +1,35 @@
+export default {
+  type: 'page',
+  title: '评分组件事件',
+  regions: ['body', 'toolbar', 'header'],
+  body: [
+    {
+      type: 'tpl',
+      tpl: 'InputRating组件',
+      inline: false,
+      wrapperComponent: 'h2'
+    },
+    {
+      type: 'form',
+      debug: true,
+      body: [
+        {
+          name: "input-rating",
+          type: "input-rating",
+          option: "事件",
+          onEvent: {
+            change: {
+              actions: [
+                {
+                  actionType: 'toast',
+                  msgType: 'info',
+                  msg: '派发change事件'
+                }
+              ]
+            }
+          }
+        }
+      ]
+    }
+  ]
+};

examples/components/Example.jsx

@@ -81,6 +81,7 @@ import TabsEventSchema from './EventAction/TabsEvent';
 import UploadEventSchema from './EventAction/UploadEvent';
 import SelectEventActionSchema from './EventAction/SelectEvent';
 import ButtonEventActionSchema from './EventAction/ButtonEvent';
+import InputRatingEventSchema from './EventAction/InputRatingEvent';
 import WizardSchema from './Wizard';
 import ChartSchema from './Chart';
 import EChartsEditorSchema from './ECharts';
@@ -574,6 +575,11 @@ export const examples = [
                 label: '标签页组件',
                 path: 'examples/event/tabs',
                 component: makeSchemaRenderer(TabsEventSchema)
+              },
+              {
+                label: '评分组件',
+                path: 'examples/event/input-rating',
+                component: makeSchemaRenderer(InputRatingEventSchema)
               }
             ]
           },

src/renderers/Form/InputRating.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import {FormItem, FormControlProps, FormBaseControl} from './Item';
+import {autobind, createObject} from '../../utils/helper';
 import Rating, {textPositionType} from '../../components/Rating';
 
 /**
@@ -84,6 +85,27 @@ export default class RatingControl extends React.Component<RatingProps, any> {
     readOnly: false
   };
 
+  async dispatchChangeEvent(eventName: string, eventData: any = {}) {
+    const {dispatchEvent, data} = this.props;
+    let rendererEvent = await dispatchEvent(
+      eventName,
+      createObject(data, {
+        value: eventData,
+      })
+    );
+
+    return rendererEvent?.prevented ?? false;
+  }
+
+  @autobind
+  async handleChange(value: number) {
+    const {onChange} = this.props;
+
+    const prevented = await this.dispatchChangeEvent('change', value);
+
+    prevented || (onChange && onChange(value));
+  }
+
   render() {
     const {
       className,
@@ -92,7 +114,6 @@ export default class RatingControl extends React.Component<RatingProps, any> {
       half,
       readOnly,
       disabled,
-      onChange,
       onHoverChange,
       allowClear,
       char,
@@ -122,9 +143,7 @@ export default class RatingControl extends React.Component<RatingProps, any> {
           charClassName={charClassName}
           textClassName={textClassName}
           textPosition={textPosition}
-          onChange={(value: number) => {
+          onChange={this.handleChange}
-            onChange && onChange(value);
-          }}
           onHoverChange={(value: number) => {
             onHoverChange && onHoverChange(value);
           }}