Сортировка массива объектов Props по дате перед передачей дочернему элементу

Question

У меня есть компонент, который получает массив объектов, называемых периодов

[
{id: 4, endDate: "2018-06-30T10:00:00+10:00"}
,{id: 3, endDate: "2017-06-30T10:00:00+10:00"}
,{id: 5, endDate: "2017-06-30T10:00:00+10:00"}
]

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

      const arr = [...this.props.periods];
      const a2 = arr.sort((a, b) => b.endDate.localeCompare(a.endDate));
this.props.periods = a2
.
.
.(child component)
<Dropdown options={this.props.periods} />

И получаю эту ошибку

TypeError: Невозможно назначить только для чтения свойство 'period' объекта '#'

Answer 1

все свойства в this.props доступны только для чтения, и вы должны использовать состояние

const periods = [...this.props.periods].sort((a, b) => 
b.endDate.localeCompare(a.endDate));

this.setState({periods})

<Dropdown options={this.state.periods} />

Answer 2

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

Вы можете обновить состояние в родительском компоненте.