feat: add onChange props to SchemaComponent (#3292)
* feat: add onChange props to SchemaComponent * fix(client): avoid undefined method error --------- Co-authored-by: mytharcher <mytharcher@gmail.com>
This commit is contained in:
parent
33c690b877
commit
da99573545
@ -1,7 +1,12 @@
|
|||||||
import { IRecursionFieldProps, ISchemaFieldProps, RecursionField, Schema } from '@formily/react';
|
import { IRecursionFieldProps, ISchemaFieldProps, RecursionField, Schema } from '@formily/react';
|
||||||
import React, { useMemo } from 'react';
|
import React, { useContext, useMemo } from 'react';
|
||||||
|
import { SchemaComponentContext } from '../context';
|
||||||
import { SchemaComponentOptions } from './SchemaComponentOptions';
|
import { SchemaComponentOptions } from './SchemaComponentOptions';
|
||||||
|
|
||||||
|
type SchemaComponentOnChange = {
|
||||||
|
onChange?: (s: Schema) => void;
|
||||||
|
};
|
||||||
|
|
||||||
function toSchema(schema?: any) {
|
function toSchema(schema?: any) {
|
||||||
if (Schema.isSchemaInstance(schema)) {
|
if (Schema.isSchemaInstance(schema)) {
|
||||||
return schema;
|
return schema;
|
||||||
@ -21,22 +26,36 @@ const useMemoizedSchema = (schema) => {
|
|||||||
return useMemo(() => toSchema(schema), []);
|
return useMemo(() => toSchema(schema), []);
|
||||||
};
|
};
|
||||||
|
|
||||||
const RecursionSchemaComponent = (props: ISchemaFieldProps) => {
|
const RecursionSchemaComponent = (props: ISchemaFieldProps & SchemaComponentOnChange) => {
|
||||||
const { components, scope, schema, ...others } = props;
|
const { components, scope, schema, ...others } = props;
|
||||||
|
const ctx = useContext(SchemaComponentContext);
|
||||||
|
const s = useMemo(() => toSchema(schema), [schema]);
|
||||||
return (
|
return (
|
||||||
|
<SchemaComponentContext.Provider
|
||||||
|
value={{
|
||||||
|
...ctx,
|
||||||
|
refresh: () => {
|
||||||
|
ctx.refresh?.();
|
||||||
|
props.onChange?.(s);
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
>
|
||||||
<SchemaComponentOptions inherit components={components} scope={scope}>
|
<SchemaComponentOptions inherit components={components} scope={scope}>
|
||||||
<RecursionField {...others} schema={toSchema(schema)} />
|
<RecursionField {...others} schema={s} />
|
||||||
</SchemaComponentOptions>
|
</SchemaComponentOptions>
|
||||||
|
</SchemaComponentContext.Provider>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const MemoizedSchemaComponent = (props: ISchemaFieldProps) => {
|
const MemoizedSchemaComponent = (props: ISchemaFieldProps & SchemaComponentOnChange) => {
|
||||||
const { schema, ...others } = props;
|
const { schema, ...others } = props;
|
||||||
const s = useMemoizedSchema(schema);
|
const s = useMemoizedSchema(schema);
|
||||||
return <RecursionSchemaComponent {...others} schema={s} />;
|
return <RecursionSchemaComponent {...others} schema={s} />;
|
||||||
};
|
};
|
||||||
|
|
||||||
export const SchemaComponent = (props: (ISchemaFieldProps | IRecursionFieldProps) & { memoized?: boolean }) => {
|
export const SchemaComponent = (
|
||||||
|
props: (ISchemaFieldProps | IRecursionFieldProps) & { memoized?: boolean } & SchemaComponentOnChange,
|
||||||
|
) => {
|
||||||
const { memoized, ...others } = props;
|
const { memoized, ...others } = props;
|
||||||
if (memoized) {
|
if (memoized) {
|
||||||
return <MemoizedSchemaComponent {...others} />;
|
return <MemoizedSchemaComponent {...others} />;
|
||||||
|
Loading…
Reference in New Issue
Block a user