feat(vue2): vue2 添加 widgetListeners 配置

re #45

Author: lljj-x

packages/demo/demo-v2/src/pages/vue-editor/views/editor/viewComponents/Text/uiSchema.js

@@ -10,6 +10,11 @@ export default {
                     append: () => h('span', '.com')
                 };
             },
+            widgetListeners: {
+                input(event) {
+                    console.log('ui input', event);
+                }
+            },
             renderChildren(h) {
                 return [
                     h('span', {

packages/docs/docs/zh/guide/basic-config.md

@@ -254,6 +254,30 @@ uiSchema = {
 >1. `ui:widget` 配置 `HiddenWidget` 或者 `hidden` 既可隐藏当前元素
 >1. `ui:hidden` 支持配置表达式，详细参见这里 [ui-schema ui:hidden配置表达式](/zh/guide/data-linkage.html#ui-schema配置表达式)
 
+### ui-schema - events
+可以通过uiSchema widgetListeners 配置组件 emit events
+
+:::warning
+* 注意该配置只适合 `vue2`
+* `vue3` 的版本可以直接传递 `ui:onXxx` 即可，参见：[vue3 listeners](https://v3.cn.vuejs.org/guide/migration/listeners-removed.html#%E6%A6%82%E8%A7%88)
+:::
+
+> 如下：通过配置 ui widgetListener配置widget组件内的events
+
+```js
+{
+    'ui:options': {
+        widgetListeners: {
+            input(event) {
+                console.log('ui input', event);
+            }
+        }
+    }
+}
+```
+
+
+
 ### ui-schema - slots
 可以通过uiSchema配置render函数传递slot到你的Widget组件，使用方式如下：
 

packages/lib/utils/formUtils.js

@@ -221,6 +221,7 @@ export function getWidgetConfig({
         attrs: widgetAttrs,
         class: widgetClass,
         style: widgetStyle,
+        widgetListeners,
         fieldAttrs,
         fieldStyle,
         fieldClass,
@@ -250,6 +251,7 @@ export function getWidgetConfig({
         renderScopedSlots,
         renderChildren,
         onChange,
+        widgetListeners,
         uiProps
     };
 }

packages/lib/vue2/vue2-core/src/components/Widget.js

@@ -127,6 +127,7 @@ export default {
             type: Object,
             default: () => ({})
         },
+        widgetListeners: null, // widget组件 emits
         formProps: null,
         getWidget: null,
         renderScopedSlots: null, // 作用域插槽
@@ -315,7 +316,13 @@ export default {
                             scopedSlots: self.renderScopedSlots(h) || {}
                         } : {}),
                         on: {
+                            ...self.widgetListeners ? self.widgetListeners : {},
                             'hook:mounted': function widgetMounted() {
+                                if (self.widgetListeners && self.widgetListeners['hook:mounted']) {
+                                    // eslint-disable-next-line prefer-rest-params
+                                    self.widgetListeners['hook:mounted'].apply(this, [...arguments]);
+                                }
+
                                 // 提供一种特殊的配置 允许直接访问到 widget vm
                                 if (self.getWidget && typeof self.getWidget === 'function') {
                                     self.getWidget.call(null, self.$refs.widgetRef);
@@ -339,6 +346,11 @@ export default {
                                         });
                                     }
                                 }
+
+                                if (self.widgetListeners && self.widgetListeners.input) {
+                                    // eslint-disable-next-line prefer-rest-params
+                                    self.widgetListeners.input.apply(this, [...arguments]);
+                                }
                             }
                         }
                     },