Обрабатываем несколько полей ввода в React.js | OTUS

Обрабатываем несколько полей ввода в React.js

Если нам надо обеспечить обработку нескольких контролируемых элементов input, мы можем добавить name-атрибут на каждый элемент, позволив функции-обработчику выбрать, что конкретно делать с учетом значения event.target.name. Рассмотрим соответствующий пример:

1-1801-937189.png

На что тут важно обратить внимание? На то, что мы задействовали синтаксис вычисляемого имени свойства из ES6, что было сделано в целях обновления ключа состояния, соответствующего конкретному и определенному имени поля ввода:

2-1801-1e6f64.png

Что, в принципе, эквивалентно нижеследующему коду в ES5:

3-1801-0df852.png

Также следует добавить, что раз setState() автоматически объединяет частичное состояние в состояние текущее, то нам следует лишь вызвать его с измененными частями.

react_js_banner_1-1801-94a549.png

По материалам https://ru.react.js.org/.

Не пропустите новые полезные статьи!

Спасибо за подписку!

Мы отправили вам письмо для подтверждения вашего email.
С уважением, OTUS!

Автор
0 комментариев
Для комментирования необходимо авторизоваться