tachybase_todo/docs/en-US/development/guide/ui-schema-designer/x-designer.md
chenos a6eebb940f
feat: update docs (#990)
* feat: improve code

* feat: update docs

* feat: update docs

* Update index.md

* Update features.md

* Update when.md

* Update contributing.md

* Update translations.md

* feat: clean up

* Add files via upload

* Update the-first-app.md

* Update plugins.md

* Update a-b-c.md

* Update blocks.md

* feat: update docs

* Add files via upload

* Update charts.md

* feat: update navs

* Update index.md

* Update index.md

* Update features.md

* Update index.md

* Update docker-compose.md

* Update create-nocobase-app.md

* Update git-clone.md

* Update contributing.md

* Update translations.md

* Update plugins.md

* Update the-first-app.md

* Add files via upload

* Update charts.md

* Update charts.md

* Update a-b-c.md

* Update collections.md

* Update menus.md

* Update menus.md

Co-authored-by: Zhou <zhou.working@gmail.com>
2022-10-31 11:52:17 +08:00

62 lines
1.2 KiB
Markdown

# x-designer 组件
## 内置 x-designer 组件
- Action.Designer
- Calendar.Designer
- Filter.Action.Designer
- Form.Designer
- FormItem.Designer
- FormV2.Designer
- FormV2.ReadPrettyDesigner
- DetailsDesigner
- G2Plot.Designer
- Kanban.Designer
- Kanban.Card.Designer
- Markdown.Void.Designer
- Menu.Designer
- TableV2.Column.Designer
- TableV2.ActionColumnDesigner
- TableBlockDesigner
- TableSelectorDesigner
- Tabs.Designer
## 替换
```tsx | pure
import React, { useContext } from 'react';
import { useFieldSchema } from '@formily/react';
import {
SchemaComponentOptions,
GeneralSchemaDesigner,
SchemaSettings,
useCollection
} from '@nocobase/client';
import React from 'react';
const CustomActionDesigner = () => {
const { name, title } = useCollection();
const fieldSchema = useFieldSchema();
return (
<GeneralSchemaDesigner title={title || name}>
<SchemaSettings.Remove
removeParentsIfNoChildren
breakRemoveOn={{
'x-component': 'Grid',
}}
/>
</GeneralSchemaDesigner>
);
};
export default React.memo((props) => {
return (
<SchemaComponentOptions
components={{
'Action.Designer': CustomActionDesigner,
}}
>{props.children}</SchemaComponentOptions>
);
});
```