Redux 表单不受应用程序管理，出现奇怪的错误

Question

我正在尝试使用 Redux Form 模块，但遇到了麻烦，我不明白为什么会出现这种奇怪的错误。

我目前的问题是在一个名为“登录”的组件中显示一个 SearchBar：

从“反应”导入反应； 从'./../../cmp/searchBar/searchBar'导入搜索栏；

export default class Login extends React.Component {
  render() {
    return (
      <div>
        <SearchBar/>
      </div>
    );
  }
}

这里是 SearchBar 组件：

import React from 'react';
import {Field, reduxForm} from 'redux-form';
/**
 * The seach bar component class definition
 */
class SearchBar extends React.Component {
  /**
   * Render the searchBar component
   */
  render() {
    return (
      <form>
        <Field name="inputField" component="input" type="text"/>
        <button type="submit">Rechercher</button>
      </form>
    );
  }
}

/**
 * Decorate the form
 */
export default reduxForm({
  form: 'searchBar'
})(SearchBar);

这是我由 react-router 管理的根组件：

// some other stuff here...
import {createStore, combineReducers} from 'redux';
import {reducer as formReducer} from 'redux-form';
const reducers = {
  form: formReducer
};
const reducer = combineReducers(reducers);
const store = createStore(reducer, window.devToolsExtension && window.devToolsExtension());

ReactDOM.render(
  <Provider store={store}>
    <Router history={browserHistory}>
      <Route path="/" component={Home}>
        <Route path="login" component={Login}/>
      </Route>
    </Router>
  </Provider>,
  document.getElementById('root')
);

事实是我在屏幕上看不到我的组件，我只是在浏览器控制台中出现以下错误：

reduxForm.js:645 Uncaught TypeError: Cannot read property 'wrapped' of undefined

我可能在某个地方遗漏了一些东西......我找不到在哪里。

有什么想法吗？

编辑（部分解决）：似乎在 redux-form v6.x 上（因为 webpack 2）出现了错误，我们必须做一些（奇怪的）事情，比如导出一个包含组件：

import React from 'react';
import {Field, reduxForm} from 'redux-form';
/**
 * The seach bar component class definition
 */
class SearchBar extends React.Component {
  /**
   * Render the searchBar component
   */
  render() {
    return (
      <form>
        <Field name="inputField" component="input" type="text"/>
        <button type="submit">Rechercher</button>
      </form>
    );
  }
}

const sb = reduxForm({
  form: 'searchBar'
})(SearchBar);

export default {
  sb
};

等等：

<SearchBar.sb/>

没有错误，但屏幕上暂时没有显示任何内容:(

编辑：问题是因为 Redux 形式 6.x 。我已经降级了，它就像一个魅力：D

Answer 1

我做了一些研究，发现了以下线程：

https://github.com/erikras/redux-form/issues/1010

不确定你是否使用 webpack，但是：

为了使其与 webpack 2 一起使用，目前的解决方法是导出 引用表单组件的对象，而不是表单 组件本身。

我实际上总是使用以下语法并且到目前为止它有效：

const SearchBarForm = reduxForm({
  form: 'searchBar'
})(SearchBar);

然后导出SearchBarForm