tachybase_todo/packages/client/src/collection-manager/CollectionField.tsx
chenos a87a089acf
feat: client v0.6 (#150)
* v0.6

* update...

* feat: improve code

* improve code

* action & form

* update...

* improve code

* improve code

* improve code

* designable

* update

* update...

* api client

* RecordProvider

* collection manager

* update...

* update api client

* update use request

* update

* update doc

* test cases for compose

* docs: improve documentation
2022-01-10 19:22:21 +08:00

43 lines
1.5 KiB
TypeScript

import React, { useContext, useEffect } from 'react';
import { connect, SchemaOptionsContext, useField, useFieldSchema, useForm } from '@formily/react';
import { useCollectionField } from './hooks';
import { CollectionFieldProvider } from './CollectionFieldProvider';
import { Field, FormPath } from '@formily/core';
// TODO: 初步适配
const InternalField: React.FC = (props) => {
const field = useField<Field>();
const fieldSchema = useFieldSchema();
const { uiSchema } = useCollectionField();
const options = useContext(SchemaOptionsContext);
const component = FormPath.getIn(options?.components, uiSchema['x-component']);
const setFieldProps = (key, value) => {
field[key] = typeof field[key] === 'undefined' ? value : field[key];
};
const setRequired = () => {
if (typeof fieldSchema['required'] === 'undefined') {
field.required = !!uiSchema['required'];
}
};
// TODO: 初步适配
useEffect(() => {
setFieldProps('title', uiSchema.title);
setFieldProps('description', uiSchema.description);
setFieldProps('initialValue', uiSchema.default);
setRequired();
field.component = [component, uiSchema['x-component-props']];
}, [uiSchema.title, uiSchema.description, uiSchema.required]);
return React.createElement(component, props);
};
export const CollectionField = connect((props) => {
const fieldSchema = useFieldSchema();
return (
<CollectionFieldProvider name={fieldSchema.name}>
<InternalField {...props} />
</CollectionFieldProvider>
);
});
export default CollectionField;