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

1.2 KiB

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

替换

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>
  );
});