Redux：表单输入字段保留空白

我使用this template安装了redux-form，附加了reducer并检查了它在redux devtools中运行正常。Redux：表单输入字段保留空白

我可以在打字时看到动作流程很好，但每次击键后窗体值和输入都是空的。

在控制台中没有错误，我找不到任何线索。

我想的东西小，也许这是一个组件渲染或也许是对反应的版本...

我的包：

"react": "15.3.2", 
"redux-form": "^6.2.0",

我的登录表单：

import React from 'react'; 
import { Field, reduxForm } from 'redux-form/immutable'; 


const renderField = ({ input, label, type, meta: { touched, error } }) => { 
    console.log(input); 
    return (
    <div> 
     <label>{label}</label> 
     <div> 
     <input {...input} placeholder={label} type={type} /> 
     {touched && error && <span>{error}</span>} 
     </div> 
    </div> 
); 
}; 

class FormLogin extends React.Component { // eslint-disable-line react/prefer-stateless-function 
    static propTypes = { 
    handleSubmit: React.PropTypes.func 
    }; 
    render() { 
    const { error, handleSubmit } = this.props; 
    return (
     <div> 
     <input type="text" name="ah1" /> 
     <form onSubmit={handleSubmit}> 
      <input type="text" name="ah2" /> 
      <div> 
      <Field id="username" name="username" type="text" component={renderField} label="Username" /> 

      </div> 
      <div> 
      <Field id="password" name="password" type="text" component={renderField} label="Password" /> 
      </div> 
      {error && <strong>{error}</strong>} 
      <button type="submit">Submit</button> 
     </form> 
     </div> 
    ); 
    } 
} 

export default reduxForm({ 
    form: 'FormLogin' 
})(FormLogin);

来源

2016-11-06 chizik

发现问题，如果有人来这里找到答案。

有一个修复它的黑客。你可以找到更多在这里： https://github.com/mxstbr/react-boilerplate/issues/958

来源

2016-11-06 21:09:22 chizik

不再是黑客，redux-form似乎可以直接使用他们的不可变库来处理react-boilerplate - http://redux-form.com/6.6.0/examples/immutable/ –

对于我来说，我没有名字的减速从例子中，不幸的是导致这种难以调试错误的确切名称。

确保减速器被列为'form：formReducer'，如示例所示。

来源

2016-12-14 21:17:29

你是我的英雄！ –

Redux：表单输入字段保留空白

回答

相关问题