可快速自定义带选项功能的自定义组件

src/renderers/Form/Options.tsx

@@ -106,10 +106,10 @@ export const detectProps = itemDetectProps.concat([
   'extractValue'
 ]);
 
-export function registerOptionsControl(config: OptionsConfig) {
-  const Control = config.component;
-
-  class FormOptionsItem extends React.Component<OptionsProps, any> {
+export function asOptionsControl(
+  Control: React.ComponentType<OptionsControlProps>
+) {
+  return class FormOptionsItem extends React.Component<OptionsProps, any> {
     static displayName = `OptionsControl(${config.type})`;
     static defaultProps = {
       delimiter: ',',
@@ -826,12 +826,16 @@ export function registerOptionsControl(config: OptionsConfig) {
         />
       );
     }
-  }
+  };
+}
+
+export function registerOptionsControl(config: OptionsConfig) {
+  const Control = config.component;
 
   return registerFormItem({
     ...(config as FormItemBasicConfig),
     strictMode: false,
-    component: FormOptionsItem
+    component: asOptionsControl(Control)
   });
 }
 

src/renderers/Form/index.tsx

@@ -34,6 +34,7 @@ import {LazyComponent} from '../../components';
 import {isAlive} from 'mobx-state-tree';
 import {asFormItem} from './Item';
 import {SimpleMap} from '../../utils/SimpleMap';
+import {asOptionsControl} from './Options';
 export type FormGroup = FormSchema & {
   title?: string;
   className?: string;
@@ -1026,7 +1027,11 @@ export default class Form extends React.Component<FormProps, object> {
             control.options || {
               strictMode: false
             }
-          )(control.component);
+          )(
+            control.options || control.source
+              ? asOptionsControl(control.component)
+              : control.component
+          );
           this.componentCache.set(control.component, cache);
           control.component = cache;
         }