Редукс-форма не работает с формой входа на gatsby.js

Question

Я хочу использовать redux-form в моем gatsby.js static-site-generator, но когда я пытаюсь что-то ввести в input, ничего не вводится.

import React, { Component } from 'react';
import { Field, reduxForm } from 'redux-form';
import { Link } from 'react-router-dom';
import { connect } from 'react-redux';
import { createSession } from '../_actions';

class Login extends Component {
  renderField(field) { 
    const { meta: { touched, error } } = field;
    const className = `form-group ${touched && error ? 'has-danger' : ''}`

    return (
      <div className={className}>
        <label>{field.label}</label>

        <input
          className="form-control"
          type="text"
          {...field.input}
        />

        <div className="text-help">
          {touched ? error : ''}
        </div>
      </div> 
    )
  }

  onSubmit(values) {
    this.props.createSession(values);
  }

  render() {
    const { handleSubmit } = this.props;

    return (
      <div className="container">
        <form onSubmit={handleSubmit(this.onSubmit.bind(this))}>
          <Field
            label = "Email"
            name="email"
            type="email"
            component={this.renderField}
          />
          <Field
            label = "Password"
            name='password'
            type="password"
            component={this.renderField}
          />
          <button type="submit" className="btn btn-success">Submit</button>
          <Link to="/" className="btn btn-danger">Cancel</Link>
        </form>
      </div>
    );

  }
}


export default reduxForm({ 
  form: 'SessionsNewForm'
})(
  connect(null, { createSession })(Login)
);

Я передал formReducer вызову комбинированному Reducer в файле redurs index.js:

import { combineReducers } from 'redux';
import { reducer as formReducer } from 'redux-form/immutable';

const rootReducer = combineReducers({
  form: formReducer
});

export default rootReducer;

Мне интересно, если это проблема между redux-form и gatsby.jsпотому что я смог заставить это работать в приложении для создания реакции.Я знаю, что у Гэтсби есть редукция "под капотом", но я хотел бы сделать некоторую настройку редукса для отправки формы.

Я заметил, что когда я заменяю ...

<input
  className="form-control"
  type="text"
  {...field.input}
/> 

... с ...

<input {...field} 
  className="form-control"
  onChange={event => {
    field.onChange(event)
  }}
/>

... На самом деле я могу вводить текст во входные данные, но когда я нажимаю Submit, никакие значения не передаются методу onSubmit.

Answer 1

Я не уверен, какую версию приставки вы используете.но у меня это работает

import { combineReducers } from 'redux';
import { reducer as reduxFormReducer } from "redux-form"; //  "redux-form": "^8.2.0",
import user from './user';
import profileRegistration from './profileRegistration';

export default combineReducers({
    form: reduxFormReducer, 
    profileRegistration,
    user,
});