在 redux 形式的文本字段中设置初始值

Posted 2023-03-15

【中文标题】在 redux 形式的文本字段中设置初始值

【英文标题】：Setting an initial value in an text field in redux form

【发布时间】：2017-08-19 02:00:19

【问题描述】：

我想创建一个像上图一样的输入文本字段，并且我正在使用 redux 表单。我的输入字段组件代码如下：

<input
      ...props.input
      type=props.type
      className="form-control input-box__input"
      placeholder=props.placeholder
      value=props.value
    />

在字段标记中，我的代码是：

                <Field
                  id="currentPassword"
                  name="currentPassword"
                  component=inputField
                  type="text"
                  disabled
                  value=userSettings.map(i => i.currentPassword)
                />

在我的容器中，我也像这样使用初始值：

initialValues: fromJS(
      currentPassword: ownProps.currentPassword,

但它似乎不起作用。你知道为什么吗？

【问题讨论】：

当你创建 redux-form reducer 并在 combineReducers 中使用它时，你是从 redux-form 还是 redux-form/immutable 导入的？

redux-form/不可变 :)

Field 组件的 value 属性的目的是什么？ [redux-form docs[(redux-form.com/6.5.0/docs/api/Field.md) 没有将其列为 Field 的有效道具。可以试试去掉吗？

是的，但它不起作用

【参考方案1】：

你应该使用 initialValues 例如：

const Wrapper = (props) => 
 class Login extends Component 
   ...
 
 const LoginForm = reduxForm(
  form: 'LoginForm',
  initialValues: 
    currentPassword: "initial currentPassword",
  ,
 )(Login);
 return <LoginForm ...props />;

或

<LoginForm
 initialValues=initialValues
/>

http://redux-form.com/6.0.0-alpha.4/examples/initializeFromState/