Есть сценарий, где getDerivedStateFromProps является обязательным? - PullRequest
Новая
       80

Есть сценарий, где getDerivedStateFromProps является обязательным?

0 голосов
/ 17 января 2020

Как указано в документации React, этот API следует использовать экономно, поскольку для достижения того же результата можно использовать более простые альтернативы. Это то, что я понимаю и с чем полностью согласен.
Однако в качестве отдельного API должен быть сценарий, в котором он является обязательным. Меня озадачивает то, что даже упомянутые do c «редкие случаи использования» для этого API не убеждают в том, что он исключительно необходим.
Возьмем, например, второй вариант использования: https://reactjs.org/blog/2018/03/27/update-on-async-rendering.html#fetching -external-data-when-props-change
Этот метод жизненного цикла просто используется для очистки устаревших данных перед рендерингом новых реквизитов. Но мы не можем просто очистить устаревшие данные в componentDidUpdate? Несмотря на то, что это вызовет ненужный повторный рендеринг, где сравнение реквизита будет равным, это приемлемое решение того, что оно стоит. 

 componentDidUpdate(prevProps, prevState) {
    if (prevProps.id !== this.props.id) {
      this.setState({ externalData: null });
      this._loadAsyncData(this.props.id);
    }
  }

И я немного повозился, чтобы показать, что два решения дают одинаковый конечный результат: https://codesandbox.io/embed/sharp-paper-p5hv2?fontsize=14&hidenavigation=1&theme=dark

Где, по вашему мнению, целесообразно использовать этот API ?

1 Ответ

0 голосов
/ 17 января 2020

Но мы не можем просто очистить устаревшие данные в componentDidUpdate? Несмотря на то, что это вызовет ненужный повторный рендеринг, где сравнение реквизита будет равным, это приемлемое решение того, что оно стоит.

Если допустимо рендерить пустой контент, тогда он вам не нужен.

Я бы переставил с индикатором загрузки (путем изменения флага в состоянии) рядом с существующим контентом (без очистки существующих данных до загрузки нового) - если контент отображается как отдельный компонент (с пропущенными одинаковыми реквизитами, «Presentational vs Container» Компоненты ") повторное рендеринг дешево.

...