Я постараюсь охватить важные причины, по которым эти жизненные циклы не могут быть использованы.
componentWillMount():
Предположение:
Люди думали, что выборка данных внутри componentWillMount позволит избежать первоначальной пустой визуализации состояния, поэтому компонент не будет пустым.
Что на самом деле произошло:
Рендеринг компонента происходит сразу после вызван componentWillMount. Поэтому, если в выборке данных есть задержка, компонент все равно покажет состояние загрузки.
При выполнении вызова API браузер продолжит обрабатывать другие элементы приложения, пока вызов API получает данные с сервера. Таким образом, React по-прежнему будет render the component regardless whether the component has data or not
componentDidMount() и будет называться twice: один раз на сервер и один раз на клиенте.
Решение:
Чтобы преодолеть это вводящее в заблуждение понимание, было введено componentDidMount(), которое будет вызываться только один раз при получении данных.
componentWillUpdate():
Предположение:
Люди думали, что componentWillUpdate вызывает всякий раз, когда в состоянии происходит обновление (путем вызова setState), что обновит компонент.
Что на самом деле произошло:
Да, компонент обновлялся каждый раз, когда в componentWillUpdate происходит обновление состояния, но при внешнем обратном вызове componentWillUpdate вызывался несколько раз для одного обновления. (Поверьте, я сталкивался с этой проблемой: P).
Решение:
Чтобы избежать этой проблемы, введено componentDidUpdate(), которое будет вызываться только один раз для каждого обновления.
Примечание:
componentWillReceiveProps также небезопасно по той же причине componentWillUpdate
Для получения дополнительной информации, см. Этот документ
Надежда это помогает:)