Question

我能够使用redux-form渲染输入字段，但我似乎无法在字段内键入任何文本（组件似乎在每次击键时重新渲染）。下面是代码，我创建了一个非常简单的代码来尝试查明问题：

＆＃13;

import React, { Component } from 'react';
import { connect } from 'react-redux';
import { createStore, combineReducers } from 'redux';
import { Field, reduxForm, reducer as formReducer } from 'redux-form';

const reducers = {
  // ... your other reducers here ...
  form: formReducer     // <---- Mounted at 'form'
};

const reducer = combineReducers(reducers);
const store = createStore(reducer);

class TestForm extends Component {

  formSubmit(props) {
    console.log('form submitted');
  }

  render() {

    const { handleSubmit } = this.props;

    return (
      <div>
        This is a test form.
        <div>
          <form onSubmit={handleSubmit(this.formSubmit.bind(this))}>
            <Field name="firstField" component="input" type="text" />
            <button type="submit">Submit</button>
          </form>
        </div>
      </div>
    );
  }

}

TestForm = reduxForm({
  form: 'testingForm'
})(TestForm);

export default TestForm;

＆＃13;

我还从官方的redux-form docs http://redux-form.com/6.0.2/docs/MigrationGuide.md/复制并粘贴了这个例子，我仍然遇到同样的问题。一直试图解决这个问题几个小时了。它可能是redux或redux-form的版本吗？

我使用redux v3.5.2和redux-form v6.2.1。

非常感谢任何帮助！

Answer 1

我有同样的问题。原因是我没有将formReducer添加到我正在使用的reducer列表中。要修复我添加：

import { reducer as formReducer } from 'redux-form'
const RootReducer = combineReducers({

...

   form: formReducer     // <---- Mounted at 'form'
})

Answer 2

我认为您需要查看react-redux文档。该组件需要放在<Provider store={store}>组件内。也许你是在这个文件之外做的，并且刚刚将商店初始化包括在内以提供信息？

redux-form字段无法在输入字段中输入文本

2 个答案: