tachybase_todo/packages/client/src/schema-component/antd/markdown/demos/demo2.tsx
SemmyWong dfa28983d7
feat: add Markdown component into schema components (#173)
* feat: markdown  migrate

* feat: markdown  migrate

* feat: add Markdown component into schema components

* refactor: modifty Markdown.Void component

* refactor: modifty Markdown.Void component

* refactor: modifty Markdown.Void component

* refactor: modify Markdown.Void component

* refactor: modify Markdown.Void component

* fix: x-editable=false

Co-authored-by: chenos <chenlinxh@gmail.com>
2022-01-28 13:20:01 +08:00

52 lines
1.1 KiB
TypeScript

/**
* title: Markdown.Void
*/
import { FormItem } from '@formily/antd';
import { observer, useField } from '@formily/react';
import { Markdown, SchemaComponent, SchemaComponentProvider } from '@nocobase/client';
import { Button } from 'antd';
import React from 'react';
const schema = {
type: 'object',
properties: {
markdown: {
type: 'void',
title: `Read pretty`,
'x-decorator': 'Editable',
'x-component': 'Markdown.Void',
'x-editable': false,
'x-component-props': {
content: '# Markdown content',
},
},
},
};
const Editable = observer((props: any) => {
const filed = useField<any>();
if (filed.editable) {
return props.children;
}
return (
<div>
<Button
onClick={() => {
filed.editable = true;
}}
>
</Button>
<div>{props.children}</div>
</div>
);
});
export default () => {
return (
<SchemaComponentProvider components={{ Editable, Markdown, FormItem }}>
<SchemaComponent schema={schema} />
</SchemaComponentProvider>
);
};