表单输入使用Redux Form不更新

Question

我的输入字段在按键时没有更新:

import React, { Component, PropTypes } from 'react';

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

class CitySelector extends Component {
  render() {
    const { isFetching, pristine, submitting, handleSubmit } = this.props;

    return (
      <form className="form-horizontal col-xs-offset-1" onSubmit={handleSubmit(this.fetchWeather)}>
        <div className="form-group">
          <div className="col-md-4 col-xs-4">
            <Field name="city"
                   component={city =>
                     <input type="text" className="form-control" {...city.input} placeholder="enter a city for a 5 day forecast"/>
                   }
            />
          </div>
          <div className="col-md-3 col-xs-3">
            <button type="submit" className="btn btn-success">Submit</button>
          </div>
        </div>
      </form>
    );
  }
}

export default reduxForm({
  form: 'cityForm'
})(CitySelector);

我是否需要onChange为文本输入提供处理程序？

Answer 1

我遇到了同样的问题而且我的错误非常简单.

这就是我的所作所为:

import { combineReducers } from 'redux';
import { reducer as forms } from 'redux-form';

import otherReducer from './otherReducer';

export default combineReducers({ otherReducer, forms });

请注意,我正在导入redux-form reducer forms并将其原样传递给我的combineReducers(就像我otherReducer使用的那样),使用ES6 Object属性值缩写.

问题是,关键用来传递Redux的形式减速器我们combineReducers 必须被命名为形式,所以我们必须将它更改为:

export default combineReducers({ customer, form: forms });

要么

import { reducer as form } from 'redux-form';
export default combineReducers({ otherReducer, form });

希望这有助于其他人......

Answer 2

如果您使用的是不可变数据结构,而不是:

import { reduxForm } from 'redux-form';

用这个:

import { reduxForm } from 'redux-form/immutable';

有关详细信息,请参阅此处http://redux-form.com/6.7.0/examples/immutable/