antd 给input设置值_Antd 中 Input 组件默认值的显示

Antd 中 Input 组件默认值的显示

1,input 标签中有 placeholder 可以显示默认值

但是有一些样式的问题 (字体颜色会淡一点)

placeholder 属性

2, 用 Input 组件中的 defaultValue 属性

defaultValue 属性

3,form 表单组件中的 initialValue 参数

注意: 当 Form 组件和 Input 组件一起用时, defaultValue 在 Input 组件上无法生效

使用方法: form.getFieldDecorator 配置 initialValue 参数: 默认值

form.getFieldDecorator 配置 initialValue 参数

这里将 Antd 中 form 组件的注意事项列出来 (很重要, 使用过程中经常会碰到)

经过 getFieldDecorator 包装的控件, 表单控件会自动添加 value(或 valuePropName 指定的其他属性) onChange(或 trigger 指定的其他属性), 数据同步将被 Form 接管, 这会导致以下结果:

1, 你不再需要也不应该用 onChange 来做同步, 但还是可以继续监听 onChange 等事件.

2, 你不能用控件的 value defaultValue 等属性来设置表单域的值, 默认值可以用 getFieldDecorator 里的 initialValue.

3, 你不应该用 setState, 可以使用 this.props.form.setFieldsValue 来动态改变表单值.

来源: http://www.jianshu.com/p/cc01d0857a3c