React.js: после обновления формы не удалось получить обновленное значение (`componentWillReceive`) внутри компонента

Question

Мы получаем форму с сервера, которую разрешаем пользователю редактировать, и используем lodash _.set(object, path, value) для обновления частей этой формы в зависимости от того, какую часть формы обновляет пользователь.

Мы пытаемсячтобы получить текущее значение, установив состояние внутри компонента, но получая эту ошибку;

Uncaught Error: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops

Наша функция выглядит так:

onChange = ({ form }) => {
const { path, editKeyword } = this.props;
const inputValue = form[editKeyword];

let prevForm = this.props.form;

// update the object using
const updatedForm = _.set(prevForm, path, inputValue);

// action
this.props.setCurrentForm(updatedForm); };

Мы также безуспешно попробовали следующее:

onChange = ({ form }) => {
const { path, editKeyword } = this.props;
const inputValue = form[editKeyword];
console.log("input value ", inputValue);

let prevForm = this.props.form;

const updatedForm = _.set(prevForm, path, inputValue);

// when we try to update local state
this.setState({ form: updatedForm}) };

Кому-нибудь повезло с этим?

Answer 1

Ваша функция onChange срабатывает при изменении некоторых значений формы.Я не знаю, что делает функция setCurrentForm, но если она изменяет данные, относящиеся к форме, у нас здесь бесконечный цикл.Пользователь изменил текстовое значение формы, onChange запускает и запускает функцию setCurrentForm.Последнее текстовое значение мутированной формы, и функция onChange снова запускается.Я думаю, что это проблема.