Как установить состояние из дочернего компонента, для которого требуется функция для установки состояния с датами реакции?

Question

Я использую дату реакции, чтобы попытаться установить состояние выбранных дат:

<DateRangePicker 
  ...
  onDatesChange={({ startDate, endDate }) => this.setState({ startDate, 
  endDate })} 
  ...
/> // PropTypes.func.isRequired

Это прекрасно работает, если оно находится в главном компоненте, где живет состояние, но теперь у меня есть DateRangePicker в дочернем компоненте этого компонента, поэтому я не могу просто установить состояние от дочернего.

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

В дочернем компоненте:

<DateRangePicker 
  ...
  onDatesChange={({ startDate, endDate }) => props.onDatesChange({ startDate, 
  endDate })}
  ...
/> 

В родительском компоненте:

onDatesChange = (startDate, endDate) => {
    this.setState({
      startDate,
      endDate
    })
  };

Хотя это работает для другого параметра в DateRangePicker, который устанавливает состояние в родительском элементе:

у ребенка:

<DateRangePicker 
  ...
  onFocusChange={props.onFocusChange}
  ...
/> 

В родительском:

  onFocusChange = focusedInput => this.setState({ focusedInput })

Answer 1

Похоже, вы вызываете props.onDatesChange с объектом, но функция onDatesChange родительского компонента принимает два параметра.

// Parent:
onDatesChange = (startDate, endDate) => {

// Child:
props.onDatesChange({ startDate, endDate })

Я бы, вероятно, изменил родительский объект, чтобы взять объект, чтобы он соответствовал другим аналогичным функциям.