首页 > 解决方案 > redux 表单的错误消息 - 元素类型无效

问题描述

我正在使用 reduxForm。下面是我的代码。

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

                class PostsNew extends Component {

                    renderTitleField(field) {
                      return (
                        <div className="form-group">
                          <label>field.label</label>
                          <input
                            className="form-control"
                            type="text"
                            {...field.input}
                          />
                        </div>
                      );
                    }

                    render() {
                        return (
                          <form>
                            <Field 
                               label="Title"
                               name="title"
                               Component={this.renderTitleField}
                            />
                             <Field 
                               label="Categories"
                               name="categories"
                               Component={this.renderTitleField}
                            />
                            <Field 
                               label="Content"
                               name="content"
                               Component={this.renderTitleField}
                            />
                          </form>         
                        );                   
                    }
                }

                export default reduxForm({
                  form: 'PostsNewForm'
                })(PostsNew);

这是我的主 index.js 文件的代码。我不确定这可能也有帮助

                import React from "react";
                import ReactDOM from "react-dom";
                import "bootstrap/dist/css/bootstrap.min.css";

                import { createStore, compose, applyMiddleware } from "redux";
                import { BrowserRouter, Route, Switch } from "react-router-dom";
                import promise from "redux-promise";
                import { Provider } from "react-redux";
                import reducers from "./reducers";
                import PostsIndex from "./components/posts_index";
                import PostsNew from "./components/posts_new";

                const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; //add support for redux dev tools.

                const store = createStore(reducers, composeEnhancers(applyMiddleware(promise)));

                ReactDOM.render(
                  <Provider store={store}>
                    <BrowserRouter>
                      <div>
                        <Switch>
                            <Route path="/posts/new" component={PostsNew} />
                            <Route path="/" component={PostsIndex} />            
                        </Switch> 
                      </div>
                    </BrowserRouter>
                  </Provider>,
                  document.querySelector("#root")
                );

我收到了附加的错误消息,不知道如何解决这个问题。请协助。 错误信息

标签: reactjsredux

解决方案


推荐阅读