redux 表单，Field 组件问题

Question

我在代码中使用 Redux 表单中的“字段”组件时遇到了一些问题。只需按照 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 或引导表单字段，它可以正常工作。

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

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

任何想法为什么 Fields 组件不起作用？

谢谢，

Answer 1

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