Uncaught RangeError: Превышен максимальный размер стека вызовов - ReactJS

Question

Я перебрал все вопросы, подобные моему, но не смог найти ничего полезного для этого случая.

Пожалуйста помоги.

Это моя функция:

renderFields() {
    if (this.props.field) { // some prop

      return (
        <SelectBox
          className="selectbox"
          value={this.state.selectId}
        />
      );
    }
  }

Где используется:

renderAllFields() {
  <div>{this.renderFields()}</div>
}

Это генерирует следующее сообщение:

Uncaught RangeError: Maximum call stack size exceeded

Вероятно, это как-то связано с жизненными циклами в React, но я не уверен.

Например, когда я проверяю:

componentDidUpdate = (prevProps) => {
    console.log('prevProps', prevProps);
    console.log('this.props', this.props);
  };

Они выглядят одинаково.

Благодарю.

РЕДАКТИРОВАТЬ:

render() {
  return (
    <div>
      <Formsy.Form
         ref="form"
         onChange={this.checkForChange}>
        <Grid fluid className="container__seven--holder">
          {this.renderAllFields()}
        </Grid>
     </Formsy.Form>
    </div>
  )
}

checkForChange() получает значения из формы и устанавливает обновленное состояние, используя:

this.setState(updatedState);

Я считаю, что проблема заключается в обновлении при каждом изменении.. даже когда я двигаю мышь, она продолжает обновляться.

Answer 1

Поскольку вы не поделились достаточной информацией или полным кодом компонента, я подозреваю, что причиной может быть ниже

+ Изменить

   <Formsy.Form
     ref="form"
     onChange={this.checkForChange}>
    <Grid fluid className="container__seven--holder">
      {this.renderAllFields()}
    </Grid>
 </Formsy.Form>

к

Ниже будет работать решение, если вы ожидаете событие для функции checkForChange

    <Formsy.Form
     ref="form"
     onChange={e => this.checkForChange(e)}>
    <Grid fluid className="container__seven--holder">
      {this.renderAllFields()}
    </Grid>
 </Formsy.Form>

Ниже будет работать решение, если вы не ожидаете событие для функции checkForChange

    <Formsy.Form
     ref="form"
     onChange={() => this.checkForChange()}>
    <Grid fluid className="container__seven--holder">
      {this.renderAllFields()}
    </Grid>
   </Formsy.Form>