设置选择默认值不起作用

时间:2018-03-13 23:01:25

标签: reactjs redux redux-form

使用Bulma CSS获得一些帮助我制作了自定义组件,使我能够使用redux-form处理不同类型的输入。

我想为选择输入设置默认值。

i

我在import React from 'react'; import { Field } from 'redux-form'; const DropDownItem = ({ spec }) => { const { name, defaultValue, items, iconLeft } = spec; return ( <div className="field"> <div className="control has-icons-left"> <div className="select is-fullwidth"> <Field name={name} value={defaultValue} component="select"> {/* loop for countries */} {items.map((country, i) => ( <option value={country} key={i}> {country} </option> ))} </Field> </div> <div className="icon is-left"> <i className={iconLeft} /> </div> </div> </div> ); }; export default DropDownItem; 中有正确的值,但默认情况下下拉列表不会选择此值。

2 个答案:

答案 0 :(得分:2)

value的{​​{1}}由redux-form商店中的值控制。初始化时,应在配置中为redux-form表单设置<Field />

initialValues

您还可以将import React from 'react' import { Field, reduxForm } from 'redux-form' let MyFormComponent = props => { const { handleSubmit } = props; return ( <form onSubmit={handleSubmit}> <Field name="fieldName" component="input" /> // this field's default value will be 'defaultValue', as set in initialValues ... </form> ) } MyFormComponent = reduxForm({ form: 'myForm', initialValues: { 'fieldName': 'defaultValue', ... } })(MyFormComponent) export default MyFormComponent; 作为initialValues传递到表单组件。

issue

答案 1 :(得分:2)

根据this thread on Github {/ 1}} defaultValue已禁用redux-form

相反,您可以使用initialValues

redux-form API

您可以详细了解initialValues on Redux Form Docsinitializefromstate