от Тиффани Уайт

Этот пост первоначально был опубликован в моем блоге.

this в React является ссылкой на текущий компонент. Обычно this в React привязан к своим встроенным методам. Если вы хотите обновить состояние или использовать обработчик событий в форме, вы можете сделать что-то вроде этого:

где this.someInput передает состояние любому воспроизводимому компоненту React.

Но, к сожалению, React не привязывается автоматически this к пользовательским методам. Это означает, что если бы я хотел манипулировать DOM, получая входные данные, что вы не можете сделать, как в обычном JavaScript, я бы создал ref делать все, что я хотел, мастерить DOM.

Но поскольку React не привязывается автоматически thisследующий код будет выводить undefined при регистрации:

Чтобы этого избежать, мы могли бы воспользоваться constructor функция для визуализации компонента или получения нужного нам состояния:

Хотя это достойный способ воспроизведения ссылки на компонент, что если вы хотите связать несколько пользовательских методов в одном компоненте? Было бы довольно беспорядочно…

Вы поняли идею.

Вместо этого мы можем связать this к пользовательским методам React, объявляя метод, назначая его стрелковой функции:

что позволит нам связать значение this к SomeComponent компонент.

Надеюсь, это поможет!

ES6 дал нам классы и конструкторы, и React сразу использовал их. Вы нет всегда нужен конструктор, и он помогает знать, когда его использовать, а когда нет.

Пока ты здесь!

Иногда пишу ненавязчивые письма. Это письма разработчиков, которые немного интимнее, чем обычные информационные бюллетени. Зарегистрируйтесь, если хотите. Не беспокойтесь.