Reactjs 使用react-Redux的简单Redux表单

在执行下面的代码片段时，我得到了以下错误。

---

错误：字段必须位于用reduxForm（）修饰的组件内

src/components/LoginForm/index.js

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

class LoginForm extends Component {
    render () {
        const {handleSubmit} = this.props;
        return (
            <form onSubmit={handleSubmit}>
                <Field 
                    name="username"
                    component="input"
                    type="text"
                    placeholder="Username"
                />

                <Field 
                    name="password"
                    component="input"
                    type="password"
                    placeholder="Password"
                />
                <button type="submit" label="submit">Submit</button>
            </form>    
        );
    }
}

export default reduxForm({
    form: 'simpleform'
})(LoginForm)

import React，{Component}来自'React'；
从“redux form”导入{Field，reduxForm}；
类LoginForm扩展组件{
渲染（）{
const{handleSubmit}=this.props；
返回(
提交
);
}
}
导出默认reduxForm({
表单：“simpleform”
})（LoginForm）

试试这个，而且它是类组件而不是功能组件，所以你是如何在App.js中导入你的LoginForm的

像这样进口

import LoginForm from 'LoginForm'; // Default export

像这样输出：

LoginForm= reduxForm({
       form: 'simpleform'
    })(LoginForm)
    export default LoginForm;

---

将类组件变成功能组件可能是解决方案。试试这个

从“React”导入React；
从“redux表单”导入{Field，reduxForm}；
const LoginForm=props=>{
const{handleSubmit}=props；
返回(
提交
);
};
导出默认reduxForm({
表格：“simpleform”
})（LoginForm）；

您是否尝试过在

reduxForm

中包装字段，而不仅仅是普通的

表单

？是否需要对上述代码进行任何修改？我想应该将其包装在reduxForm组件中（如错误所述）这不是这样吗？导出默认reduxForm（{form:'simpleform'}）（LoginForm）错误：字段必须位于用reduxForm（）修饰的组件内以下错误来自以下代码段..src/index.js ReactDOM.render（，document.getElementById（'root'））；你能通过分享App.js更新帖子吗