Как связать это в React без конструктора

1656539646 kak svyazat eto v react bez konstruktora

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

1*LyzgUAvHq6Z-q_fvqCA5pg
Фото Евы Блю на Unsplash

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *