|
@@ -740,7 +740,7 @@ import { Form } from '@douyinfe/semi-ui';
|
|
|
|
|
|
### Using Input Group
|
|
|
|
|
|
-When you need to combine some fileds to use, you can use `Form.InputGroup` to wrap them.
|
|
|
+When you need to combine some fields to use, you can use `Form.InputGroup` to wrap them.
|
|
|
In Semi Form, when you using field components like `Form.Input`、`Form.Select`, Form will insert Label module automatically for them.
|
|
|
But usually, in`InputGroup` you only need a Label belonging to the entire Group.
|
|
|
You can set the label property in the `InputGroup` to insert a Label belonging to the Group
|
|
@@ -1568,8 +1568,8 @@ class CustomFieldDemo extends React.Component {
|
|
|
| onChange | Callback invoked when form update, including Fields mount/unmount / value change / <br/> blur / validation status change / error status change. | function (formState: object) | |
|
|
|
| onValueChange | Callback invoked when form values update | function (values: object, changedValue: object) |
|
|
|
| onReset | Callback invoked after clicked on reset button or executed `formApi.reset()` | function () | |
|
|
|
-| onSubmit | Callback invoked after clicked on submit button or exected `formApi.submit()`, <br/>and all validation pass. | function (values: object) | |
|
|
|
-| onSubmitFail | Callback invoked after clicked on submit button or exected `formApi.submit()`,<br/> but validate failed. | function (object, values: object) | |
|
|
|
+| onSubmit | Callback invoked after clicked on submit button or executed `formApi.submit()`, <br/>and all validation pass. | function (values: object) | |
|
|
|
+| onSubmitFail | Callback invoked after clicked on submit button or executed `formApi.submit()`,<br/> but validate failed. | function (object, values: object) | |
|
|
|
| validateFields | Form-level custom validate functions are called at submit or formApi.validate(). <br/>Supported synchronous / asynchronous function | function (values) | |
|
|
|
| component | For declaring fields, not used at the same time as render, props.children | ReactNode |
|
|
|
| render | For declaring fields, not used at the same time as component, props.children | function |
|
|
@@ -1701,7 +1701,7 @@ class FormApiDemo extends React.Component {
|
|
|
| validateStatus | The validation result status of this form control, optional: `success` / `error` / `warning` / `default` | string | 'default' |
|
|
|
| trigger | The timing of triggering the verification, optional: `blur` / `change` / `custom` / `mount` <br/> 1. When set to custom, only formApi will trigger the verification <br/> 2。mount (triggered once when mounting) | string | 'change' |
|
|
|
| onChange | Callback invoked when this field value changes |
|
|
|
-| transform | transofrm field values before validation | function(fieldValue) | | (value) => Number(value) |
|
|
|
+| transform | transform field values before validation | function(fieldValue) | | (value) => Number(value) |
|
|
|
| allowEmptyString | Whether to allow values to be empty strings. <br/>When the value is '' by default, the key corresponding to this field will be removed from `values`. <br/>If you want to keep the key, you need to set allowEmptyString to true | boolean | | false |
|
|
|
| convert | After the field value changes, before rerender, update the value of filed | function(fieldValue) | | (value) => newValue(value) |
|
|
|
| stopValidateWithError | When it is true, the rules check is used. After encountering the first rule that fails the check, it will no longer trigger the check of subsequent rules<br/>**since v0.35.0** | boolean | | false |
|
|
@@ -1770,7 +1770,7 @@ const { Slot } = Form;
|
|
|
| Properties | Instructions | Type | Default |
|
|
|
| ---------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------- | ------- |
|
|
|
| label | Slot's [Label configuration](#Form.Label), for example {text: 'semi', align: 'left'}; can also be passed directly into string, inside the Slot will be automatically encapsulated in legal Label format | object\|string | |
|
|
|
-| className | Classname of Slot Wrappper | string | |
|
|
|
+| className | Classname of Slot Wrapper | string | |
|
|
|
| style | Slot inline style | object | |
|
|
|
| children | Content of slot. You can place your custom component here | ReactNode | |
|
|
|
|
|
@@ -1796,7 +1796,7 @@ const { ErrorMessage } = Form;
|
|
|
| ----------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------- |
|
|
|
| valueKey | The component represents the property of the value, such as Switch, Radio is' checked 'and Input is' value ' | 'value' |
|
|
|
| onKeyChangeFnName | The callback function when the component value changes, generally 'onChange' | 'onChange' |
|
|
|
-| valuePath | The path of the value attribute to the first parameter in the callback function, such as Radio's onChange (e.target. checked), then the value needs to be set to target .checkd; Radio Group's onChange (e.target. value), which is' target .value '; if the first parameter is the value itself, there is no need to take the value down, the item does not need to be set | |
|
|
|
+| valuePath | The path of the value attribute to the first parameter in the callback function, such as Radio's onChange (e.target. checked), then the value needs to be set to target .checked; Radio Group's onChange (e.target. value), which is' target .value '; if the first parameter is the value itself, there is no need to take the value down, the item does not need to be set | |
|
|
|
| withCursor | Do you need to maintain a cursor for Input class components | false |
|
|
|
| shouldMemo | Do you need memo (for form performance optimization to avoid Field being rerender when Formrerender), for custom components with internal states that may update and affect the UI, this item should be set false | true |
|
|
|
|