React JS — формы

React JS — формы

От автора: в этой главе мы рассмотрим, как использовать в React формы.

Простой пример

В следующем примере мы установим элемент ввода формы с value = {this.state.data}. Это позволяет обновлять состояние всякий раз, когда изменяется входное значение. Мы используем событие onChange, которое будет следить за изменениями ввода и соответствующим образом обновлять состояние.

App.jsx

main.js

Когда изменится значение входного текста, будет обновлено состояние.

Сложный пример

В следующем примере мы увидим, как использовать формы из дочернего компонента. onChange вызовет обновление состояния, которое будет передано дочернему входному значению и отображено на экране. Аналогичный пример используется в главе «События». Когда нам нужно обновить состояние от дочернего компонента, нам нужно передать функцию, которая будет обрабатывать обновление (updateState) в качестве свойства (updateStateProp).

App.jsx

main.js

Это дает следующих результат.

Источник: https://www.tutorialspoint.com/

Редакция: Команда webformyself.

FullStack-Мастер

FullStack-Мастер. Разработка CRM-системы на Node.js, Express, Angular 6

Научиться

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

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

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

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Я не робот.

Spam Protection by WP-SpamFree