Почему изменение componentDidMount на функцию без стрелки заставляет горячую перезагрузку работать снова? - PullRequest
0 голосов
/ 25 февраля 2019

Для одного экрана в моем приложении React Native горячая перезагрузка не работала.Я обнаружил, что решение было изменить

componentDidMount = () => {
  <...do stuff with this.props...>
}

на

componentDidMount() {
  <...do stuff with this.props...>
}

Так что все, что я сделал, это изменил componentDidMount с функции стрелки на функцию без стрелки.Итак, мой вопрос:

Почему изменение функции без стрелки заставляет горячую перезагрузку снова работать?Я знаю, что создание функции без стрелки означает, что если функция была вызвана из какого-то другого контекста, значение this было бы связано с контекстом, в котором вызывается функция, тогда как с функцией стрелки она будетвсегда быть привязанным к компоненту, в котором он был определен.Но как это влияет на горячую перезагрузку?Приводит ли горячая перезагрузка к вызову componentDidMount из другого контекста и повторному связыванию this?Если да, то как это повлияет на горячую перезагрузку?

Спасибо!

ОБНОВЛЕНИЕ

Некоторые пользователи спрашивают, является ли это дубликатом (Методы в объектах ES6: использование функций со стрелками ) или ( Функция стрелки по сравнению с объявлением / выражениями функций: являются ли они эквивалентными / заменяемыми? )

Это не дубликат ни одного из этих,Обратите внимание, что я обрисовал различия между функциями со стрелками и без стрелок.У меня вопрос о том, как эти различия относятся именно к горячей перезагрузке.

1 Ответ

0 голосов
/ 25 февраля 2019

Я думаю, что когда метод объявляется как

componentDidMount () {
   <... do stuff with this.props ...>
}

, он позволяет интерпретатору оптимизировать код, потому что это метод класса - он не принадлежит самому классу, но не изменяется отобъект к объекту.

т.е. есть класс A и метод b - во всех экземплярах класса A метод b будет одинаковым, и оптимизатор сможет его увидеть и оптимизировать

, когда методобъявляется как

componentDidMount = () => {
   <... do stuff with this.props ...>
}

, фактически создает метод для каждого экземпляра A, и поэтому оптимизатор видит разные методы b и не может оптимизировать

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...