Skip to content

Commit 2501e72

Browse files
authored
feat(.md): Form => FormLayout (#1427)
1 parent 7db3417 commit 2501e72

File tree

6 files changed

+101
-59
lines changed

6 files changed

+101
-59
lines changed

packages/next/docs/components/FormCollapse.md

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,11 @@ import {
1414
Input,
1515
FormButtonGroup,
1616
Submit,
17+
FormLayout,
1718
} from '@formily/next'
1819
import { createForm } from '@formily/core'
1920
import { FormProvider, createSchemaField } from '@formily/react'
20-
import { Button, Form } from '@alifd/next'
21+
import { Button } from '@alifd/next'
2122

2223
const SchemaField = createSchemaField({
2324
components: {
@@ -33,7 +34,7 @@ const formCollapse = FormCollapse.createFormCollapse()
3334
export default () => {
3435
return (
3536
<FormProvider form={form}>
36-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 10 }}>
37+
<FormLayout labelCol={6} wrapperCol={10}>
3738
<SchemaField>
3839
<SchemaField.Void
3940
title="折叠面板"
@@ -103,7 +104,7 @@ export default () => {
103104
</Button>
104105
<Submit onSubmit={console.log}>提交</Submit>
105106
</FormButtonGroup.FormItem>
106-
</Form>
107+
</FormLayout>
107108
</FormProvider>
108109
)
109110
}
@@ -119,10 +120,11 @@ import {
119120
Input,
120121
FormButtonGroup,
121122
Submit,
123+
FormLayout,
122124
} from '@formily/next'
123125
import { createForm } from '@formily/core'
124126
import { FormProvider, createSchemaField } from '@formily/react'
125-
import { Button, Form } from '@alifd/next'
127+
import { Button } from '@alifd/next'
126128

127129
const SchemaField = createSchemaField({
128130
components: {
@@ -203,7 +205,7 @@ const schema = {
203205
export default () => {
204206
return (
205207
<FormProvider form={form}>
206-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 10 }}>
208+
<FormLayout labelCol={6} wrapperCol={10}>
207209
<SchemaField schema={schema} scope={{ formCollapse }} />
208210
<FormButtonGroup.FormItem>
209211
<Button
@@ -224,7 +226,7 @@ export default () => {
224226
</Button>
225227
<Submit onSubmit={console.log}>提交</Submit>
226228
</FormButtonGroup.FormItem>
227-
</Form>
229+
</FormLayout>
228230
</FormProvider>
229231
)
230232
}

packages/next/docs/components/FormDialog.md

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@
66

77
```tsx
88
import React from 'react'
9-
import { FormDialog, FormItem, Input } from '@formily/next'
9+
import { FormDialog, FormItem, Input, FormLayout } from '@formily/next'
1010
import { createSchemaField } from '@formily/react'
11-
import { Button, Form } from '@alifd/next'
11+
import { Button } from '@alifd/next'
1212

1313
const SchemaField = createSchemaField({
1414
components: {
@@ -23,7 +23,7 @@ export default () => {
2323
onClick={() => {
2424
FormDialog('弹窗表单', () => {
2525
return (
26-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 14 }}>
26+
<FormLayout labelCol={6} wrapperCol={14}>
2727
<SchemaField>
2828
<SchemaField.String
2929
name="aaa"
@@ -57,7 +57,7 @@ export default () => {
5757
<FormDialog.Footer>
5858
<span style={{ marginLeft: 4 }}>扩展文案</span>
5959
</FormDialog.Footer>
60-
</Form>
60+
</FormLayout>
6161
)
6262
})
6363
.open({
@@ -78,9 +78,9 @@ export default () => {
7878

7979
```tsx
8080
import React from 'react'
81-
import { FormDialog, FormItem, Input } from '@formily/next'
81+
import { FormDialog, FormItem, Input, FormLayout } from '@formily/next'
8282
import { createSchemaField } from '@formily/react'
83-
import { Button, Form } from '@alifd/next'
83+
import { Button } from '@alifd/next'
8484

8585
const SchemaField = createSchemaField({
8686
components: {
@@ -129,12 +129,12 @@ export default () => {
129129
onClick={() => {
130130
FormDialog('弹窗表单', () => {
131131
return (
132-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 14 }}>
132+
<FormLayout labelCol={6} wrapperCol={14}>
133133
<SchemaField schema={schema} />
134134
<FormDialog.Footer>
135135
<span style={{ marginLeft: 4 }}>扩展文案</span>
136136
</FormDialog.Footer>
137-
</Form>
137+
</FormLayout>
138138
)
139139
})
140140
.open({
@@ -155,17 +155,17 @@ export default () => {
155155

156156
```tsx
157157
import React from 'react'
158-
import { FormDialog, FormItem, Input } from '@formily/next'
158+
import { FormDialog, FormItem, Input, FormLayout } from '@formily/next'
159159
import { Field } from '@formily/react'
160-
import { Button, Form } from '@alifd/next'
160+
import { Button } from '@alifd/next'
161161

162162
export default () => {
163163
return (
164164
<Button
165165
onClick={() => {
166166
FormDialog('弹窗表单', () => {
167167
return (
168-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 14 }}>
168+
<FormLayout labelCol={6} wrapperCol={14}>
169169
<Field
170170
name="aaa"
171171
required
@@ -197,7 +197,7 @@ export default () => {
197197
<FormDialog.Footer>
198198
<span style={{ marginLeft: 4 }}>扩展文案</span>
199199
</FormDialog.Footer>
200-
</Form>
200+
</FormLayout>
201201
)
202202
})
203203
.open({

packages/next/docs/components/FormDrawer.md

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,10 @@ import {
1313
Submit,
1414
Reset,
1515
FormButtonGroup,
16+
FormLayout,
1617
} from '@formily/next'
1718
import { createSchemaField } from '@formily/react'
18-
import { Button, Form } from '@alifd/next'
19+
import { Button } from '@alifd/next'
1920

2021
const SchemaField = createSchemaField({
2122
components: {
@@ -30,7 +31,7 @@ export default () => {
3031
onClick={() => {
3132
FormDrawer('抽屉表单', (resolve) => {
3233
return (
33-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 14 }}>
34+
<FormLayout labelCol={6} wrapperCol={14}>
3435
<SchemaField>
3536
<SchemaField.String
3637
name="aaa"
@@ -67,7 +68,7 @@ export default () => {
6768
<Reset>重置</Reset>
6869
</FormButtonGroup>
6970
</FormDrawer.Footer>
70-
</Form>
71+
</FormLayout>
7172
)
7273
})
7374
.open({
@@ -95,9 +96,10 @@ import {
9596
Submit,
9697
Reset,
9798
FormButtonGroup,
99+
FormLayout,
98100
} from '@formily/next'
99101
import { createSchemaField } from '@formily/react'
100-
import { Button, Form } from '@alifd/next'
102+
import { Button } from '@alifd/next'
101103

102104
const SchemaField = createSchemaField({
103105
components: {
@@ -146,15 +148,15 @@ export default () => {
146148
onClick={() => {
147149
FormDrawer('弹窗表单', (resolve) => {
148150
return (
149-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 14 }}>
151+
<FormLayout labelCol={6} wrapperCol={14}>
150152
<SchemaField schema={schema} />
151153
<FormDrawer.Footer>
152154
<FormButtonGroup align="right">
153155
<Submit onClick={resolve}>提交</Submit>
154156
<Reset>重置</Reset>
155157
</FormButtonGroup>
156158
</FormDrawer.Footer>
157-
</Form>
159+
</FormLayout>
158160
)
159161
})
160162
.open({
@@ -182,17 +184,18 @@ import {
182184
Submit,
183185
Reset,
184186
FormButtonGroup,
187+
FormLayout,
185188
} from '@formily/next'
186189
import { Field } from '@formily/react'
187-
import { Button, Form } from '@alifd/next'
190+
import { Button } from '@alifd/next'
188191

189192
export default () => {
190193
return (
191194
<Button
192195
onClick={() => {
193196
FormDrawer('弹窗表单', (resolve) => {
194197
return (
195-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 14 }}>
198+
<FormLayout labelCol={6} wrapperCol={14}>
196199
<Field
197200
name="aaa"
198201
required
@@ -227,7 +230,7 @@ export default () => {
227230
<Reset>重置</Reset>
228231
</FormButtonGroup>
229232
</FormDrawer.Footer>
230-
</Form>
233+
</FormLayout>
231234
)
232235
})
233236
.open({

packages/next/docs/components/Password.md

Lines changed: 27 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,15 @@
66

77
```tsx
88
import React from 'react'
9-
import { Password, FormItem, FormButtonGroup, Submit } from '@formily/next'
9+
import {
10+
Password,
11+
FormItem,
12+
FormButtonGroup,
13+
Submit,
14+
FormLayout,
15+
} from '@formily/next'
1016
import { createForm } from '@formily/core'
1117
import { FormProvider, createSchemaField } from '@formily/react'
12-
import { Form } from '@alifd/next'
1318

1419
const SchemaField = createSchemaField({
1520
components: {
@@ -22,7 +27,7 @@ const form = createForm()
2227

2328
export default () => (
2429
<FormProvider form={form}>
25-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 10 }}>
30+
<FormLayout labelCol={6} wrapperCol={10}>
2631
<SchemaField>
2732
<SchemaField.String
2833
name="input"
@@ -38,7 +43,7 @@ export default () => (
3843
<FormButtonGroup.FormItem>
3944
<Submit onSubmit={console.log}>提交</Submit>
4045
</FormButtonGroup.FormItem>
41-
</Form>
46+
</FormLayout>
4247
</FormProvider>
4348
)
4449
```
@@ -47,10 +52,15 @@ export default () => (
4752

4853
```tsx
4954
import React from 'react'
50-
import { Password, FormItem, FormButtonGroup, Submit } from '@formily/next'
55+
import {
56+
Password,
57+
FormItem,
58+
FormButtonGroup,
59+
Submit,
60+
FormLayout,
61+
} from '@formily/next'
5162
import { createForm } from '@formily/core'
5263
import { FormProvider, createSchemaField } from '@formily/react'
53-
import { Form } from '@alifd/next'
5464
const SchemaField = createSchemaField({
5565
components: {
5666
Password,
@@ -77,12 +87,12 @@ const schema = {
7787

7888
export default () => (
7989
<FormProvider form={form}>
80-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 10 }}>
90+
<FormLayout labelCol={6} wrapperCol={10}>
8191
<SchemaField schema={schema} />
8292
<FormButtonGroup.FormItem>
8393
<Submit onSubmit={console.log}>提交</Submit>
8494
</FormButtonGroup.FormItem>
85-
</Form>
95+
</FormLayout>
8696
</FormProvider>
8797
)
8898
```
@@ -91,15 +101,20 @@ export default () => (
91101

92102
```tsx
93103
import React from 'react'
94-
import { Password, FormItem, FormButtonGroup, Submit } from '@formily/next'
104+
import {
105+
Password,
106+
FormItem,
107+
FormButtonGroup,
108+
Submit,
109+
FormLayout,
110+
} from '@formily/next'
95111
import { createForm } from '@formily/core'
96112
import { FormProvider, Field } from '@formily/react'
97-
import { Form } from '@alifd/next'
98113
const form = createForm()
99114

100115
export default () => (
101116
<FormProvider form={form}>
102-
<Form labelCol={{ span: 6 }} wrapperCol={{ span: 10 }}>
117+
<FormLayout labelCol={6} wrapperCol={10}>
103118
<Field
104119
name="input"
105120
title="输入框"
@@ -115,7 +130,7 @@ export default () => (
115130
<FormButtonGroup.FormItem>
116131
<Submit onSubmit={console.log}>提交</Submit>
117132
</FormButtonGroup.FormItem>
118-
</Form>
133+
</FormLayout>
119134
</FormProvider>
120135
)
121136
```

0 commit comments

Comments
 (0)