redux 表单，Field 组件问题

Question

我在代码中使用 Redux Form 中的 "Field" 组件时遇到一些问题。只需按照 redux-form 网站上的简单示例即可。

/* MyForm.jsx */
...
import { Field, reduxForm } from 'redux-form';

class MyForm extends Component {
    ...
    <form onSubmit={handleSubmit(...)}>
        <div>
            <label>First Name</label>
            <div>
                <Field name="firstName" component="input" type="text" placeholder="First Name"/>
            </div>
        </div>
        ...
}

export default reduxForm({
    form: 'myForm'
})(MyForm);

这里是使用redux形式的父组件

/* page.jsx */
import MyForm from './MyForm';
...
<MyForm/>
...

表单未呈现，并且在控制台中显示错误：

React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components).

Uncaught Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

但是，如果我使用 material-ui 或 bootstrap 表单域，它工作正常。

我在渲染表单之前安装了表单缩减器：

import {reducer as formReducer} from 'redux-form';
const myReducer = combineReducers({
    ...
    form: formReducer
});

知道为什么 Fields 组件不起作用吗？

谢谢，

Answer 1

尝试将你的 redux 升级到 6.0。我相信 Field 组件从 v6.0 开始。

redux 表单，Field 组件问题

redux form, Field component issues

redux-form