Компонентный метод вызывается как для полей Title, так и для Content, когда React изначально отображается. Однако, хотя дополнительное изменение ввода в поле Title вызывает метод renderField, поле Content, похоже, этого не делает. Это отражено в журнале консоли, где при начальной загрузке компонента было произведено 2 «ввода изменено», а при дополнительных изменениях в заголовке печатается «изменение ввода», но при внесении изменений в поле содержимого никаких откликов не происходит. В чем дело?

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

class PostNew extends Component {

    renderField(field) {
        console.log('input changed')
        return(
            <div>
                <label>{field.label}</label>
                <input
                    type="text"
                    {...field.input}
                />
            </div>
        );
    }

    render() {
        return(
            <form>
                <Field
                    label="Title"
                    name="title"
                    component={this.renderField}
                />
                <Field
                    label="Content"
                    name="content"
                    component={this.renderField}
                />
            </form>
        )
    }
}


export default reduxForm({
    form: 'PostsNewForm' // form property is the name of the form
})(PostNew);
0
MLhacker 28 Май 2017 в 02:18

2 ответа

Лучший ответ

Хорошо, я смог повторить вашу проблему. Проблема в том, что приставка не просто подключи и играй. Вы должны добавить его в свой корневой редуктор, как показано ниже:

//src/reducers/index.js

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

const rootReducer = combineReducers({
  state: (state = {}) => state,
  form
});

export default rootReducer;

Поля формы работают, как и ожидалось, как только я добавлю это. Я загрузил копию вашего проекта Github с рабочим примером:

https://github.com/hellojebus/so-Answer

1
hellojebus 28 Май 2017 в 00:53

Для тех, кто сталкивался с подобной проблемой, как у меня. Источником проблемы в конечном итоге стал тот факт, что пакет redux-form вообще не устанавливался. Поэтому используйте yarn install redux-form или попробуйте npm, но убедитесь, что npm работает.

0
MLhacker 28 Май 2017 в 01:15