mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-24 11:10:01 +08:00
Fix form detail style
This commit is contained in:
afc163
parent
6c3d00368c
commit
15bb865037
@ -23,6 +23,7 @@ ReactDOM.render(
|
||||
<FormItem
|
||||
label="标签输入框："
|
||||
labelCol={{ span: 6 }}
|
||||
validateStatus="success"
|
||||
wrapperCol={{ span: 16 }}>
|
||||
<Input addonBefore="Http://" addonAfter=".com" defaultValue="mysite" id="site2" />
|
||||
</FormItem>
|
||||
|
||||
@ -44,11 +44,11 @@ english: Form
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
|-----------|------------------------------------------|------------|-------|
|
||||
| form | 经 `Form.create()` 包装过的组件会自带 `this.props.form` 属性，直接传给 Form 即可 | object | 无 |
|
||||
| horizontal | 水平排列布局 | boolean | false |
|
||||
| inline | 行内排列布局 | boolean | false |
|
||||
| onSubmit | 数据验证成功后回调事件 | Function(e:Event) | |
|
||||
| prefixCls | 样式类名，默认为 ant-form，通常您不需要设置 | string | 'ant-form' |
|
||||
| form | 经 `Form.create()` 包装过的组件会自带 `this.props.form` 属性，直接传给 Form 即可 | object | 无 |
|
||||
| horizontal | 水平排列布局 | boolean | false |
|
||||
| inline | 行内排列布局 | boolean | false |
|
||||
| onSubmit | 数据验证成功后回调事件 | Function(e:Event) | |
|
||||
| prefixCls | 样式类名，默认为 ant-form，通常您不需要设置 | string | 'ant-form' |
|
||||
|
||||
### Form.create(options)
|
||||
|
||||
@ -102,36 +102,35 @@ CustomizedForm = Form.create({})(CustomizedForm);
|
||||
| options.rules | 校验规则，参见 [async-validator](https://github.com/yiminghe/async-validator) | array | |
|
||||
| options.onXXX | 由于 `getFieldProps` 会占用 `onChange` 等事件（即你所设置的 `trigger` `validateTrigger`），所以如果仍需绑定事件，请在 `options` 内设置 | function | 无 |
|
||||
|
||||
|
||||
### Form.Item
|
||||
|
||||
> 一个 Form.Item 建议只放一个 child，有多个 child 时，`help` `required` `validateStatus` 无法自动生成。
|
||||
|
||||
| 参数 | 说明 | 类型 | 可选值 |默认值 |
|
||||
|-----------|------------------------------------------|------------|-------|--------|
|
||||
| label | label 标签的文本 | string | | |
|
||||
| labelCol | label 标签布局，通 `<Col>` 组件，设置 `span` `offset` 值，如 `{span: 3, offset: 12}` | object | | |
|
||||
| wrapperCol | 需要为输入控件设置布局样式时，使用该属性，用法同 labelCol | object | | |
|
||||
| help | 提示信息，如不设置，则会根据校验规则自动生成 | string | | |
|
||||
| extra | 额外的提示信息，和 help 类似，当需要错误信息和提示文案同时出现时，可以使用这个。 | string | | |
|
||||
| required | 是否必填，如不设置，则会根据校验规则自动生成 | bool | | false |
|
||||
| validateStatus | 校验状态，如不设置，则会根据校验规则自动生成 | string | 'success' 'warning' 'error' 'validating' | |
|
||||
| hasFeedback | 配合 validateStatus 属性使用，是否展示校验状态图标 | bool | | false |
|
||||
| prefixCls | 样式类名，默认为 ant-form，通常您不需要设置 | string | | 'ant-form' |
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|
||||
|-----------|------------------------------------------|-----------|-------|--------|
|
||||
| label | label 标签的文本 | string | | |
|
||||
| labelCol | label 标签布局，通 `<Col>` 组件，设置 `span` `offset` 值，如 `{span: 3, offset: 12}` | object | | |
|
||||
| wrapperCol | 需要为输入控件设置布局样式时，使用该属性，用法同 labelCol | object | | |
|
||||
| help | 提示信息，如不设置，则会根据校验规则自动生成 | string | | |
|
||||
| extra | 额外的提示信息，和 help 类似，当需要错误信息和提示文案同时出现时，可以使用这个。 | string | | |
|
||||
| required | 是否必填，如不设置，则会根据校验规则自动生成 | bool | | false |
|
||||
| validateStatus | 校验状态，如不设置，则会根据校验规则自动生成 | string | 'success' 'warning' 'error' 'validating' | |
|
||||
| hasFeedback | 配合 validateStatus 属性使用，展示校验状态图标，建议只配合 Input 组件使用 | bool | | false |
|
||||
| prefixCls | 样式类名，默认为 ant-form，通常您不需要设置 | string | | 'ant-form' |
|
||||
|
||||
### Input
|
||||
|
||||
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|
||||
|-----------|------------------------------------------|------------|-------|--------|
|
||||
| type | 【必须】声明 input 类型，同原生 input 标签的 type 属性 | string | | 'text' |
|
||||
| id | id | number 或 string | | |
|
||||
| value | value 值 | any | | |
|
||||
| defaultValue | 设置初始默认值 | any | | |
|
||||
| size | 控件大小，默认值为 default 。注：标准表单内的输入框大小限制为 large。 | string | {'large','default','small'} | 'default' |
|
||||
| disabled | 是否禁用状态，默认为 false | bool | | false |
|
||||
| addonBefore | 带标签的 input，设置前置标签 | node | | |
|
||||
| addonAfter | 带标签的 input，设置后置标签 | node | | |
|
||||
| onPressEnter | 按下回车的回调 | function(e) | | |
|
||||
| type | 【必须】声明 input 类型，同原生 input 标签的 type 属性 | string | | 'text' |
|
||||
| id | id | number 或 string | | |
|
||||
| value | value 值 | any | | |
|
||||
| defaultValue | 设置初始默认值 | any | | |
|
||||
| size | 控件大小，默认值为 default 。注：标准表单内的输入框大小限制为 large。 | string | {'large','default','small'} | 'default' |
|
||||
| disabled | 是否禁用状态，默认为 false | bool | | false |
|
||||
| addonBefore | 带标签的 input，设置前置标签 | node | | |
|
||||
| addonAfter | 带标签的 input，设置后置标签 | node | | |
|
||||
| onPressEnter | 按下回车的回调 | function(e) | | |
|
||||
|
||||
> 如果 `Input` 在 `Form.Item` 内，并且 `Form.Item` 设置了 `id` 和 `options` 属性，则 `value` `defaultValue` 和 `id` 属性会被自动设置。
|
||||
|
||||
|
||||
@ -264,9 +264,10 @@ form {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
visibility: visible;
|
||||
font-family: "anticon" !important;
|
||||
.square(@input-height-lg);
|
||||
line-height: @input-height-lg;
|
||||
line-height: @input-height-lg + 2;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
animation: zoomIn .3s @ease-out-back;
|
||||
@ -292,7 +293,6 @@ form {
|
||||
}
|
||||
|
||||
.has-success {
|
||||
.form-control-validation(@success-color; @input-hover-border-color;);
|
||||
.ant-input {
|
||||
border-color: @input-border-color;
|
||||
box-shadow: none;
|
||||
|
||||
@ -138,7 +138,7 @@
|
||||
}
|
||||
|
||||
&-wrap > * {
|
||||
display: block;
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.@{inputClass} {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user