Skip to content

Commit 0ac734b

Browse files
authored
Update forms.md
1 parent c40d731 commit 0ac734b

File tree

1 file changed

+3
-3
lines changed

1 file changed

+3
-3
lines changed

content/docs/forms.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ redirect_from:
2525

2626
## Контролируемые компоненты {#controlled-components}
2727

28-
В HTML элементы формы, такие как `<input>`, `<textarea>` и `<select>` обычно сами управляют своим состоянием и обновляют его когда пользователь вводит данные. В React мутабельное состояние обычно содержится в свойстве компонентов `state` и обновляется только через вызов[`setState()`](/docs/react-component.html#setstate)
28+
В HTML элементы формы, такие как `<input>`, `<textarea>` и `<select>`, обычно сами управляют своим состоянием и обновляют его когда пользователь вводит данные. В React мутабельное состояние обычно содержится в свойстве компонентов `state` и обновляется только через вызов[`setState()`](/docs/react-component.html#setstate)
2929

3030
Мы можем скомбинировать оба подхода и сделать состояние React-компонента "единственным источником правды". Тогда React-компонент будет рендерить форму и контролировать её поведение в ответ на пользовательский ввод. Значение элемента формы input в этом случае будет контролировать React, а сам элемент будет называться «контролируемый компонент».
3131

@@ -66,7 +66,7 @@ class NameForm extends React.Component {
6666

6767
[**Посмотреть на CodePen**](https://codepen.io/gaearon/pen/VmmPgp?editors=0010)
6868

69-
Мы установили атрибут `value` для поля ввода, и теперь в нём всегда будет отображаться `this.state.value`. Состояние React-компонента стало «источником истины». А, так как каждое нажатие клавиши вызывает `handleChange`, который обновляет состояние React-компонента, значение в поле будет обновляться по мере того как пользователь печатает.
69+
Мы установили атрибут `value` для поля ввода, и теперь в нём всегда будет отображаться значение `this.state.value`. Состояние React-компонента стало «источником истины». А так как каждое нажатие клавиши вызывает `handleChange`, который обновляет состояние React-компонента, значение в поле будет обновляться по мере того, как пользователь печатает.
7070

7171
В контролируемом компоненте с каждой мутацией состояния связана функция-обработчик. Благодаря этому валидация или изменение введённого значения становится простой задачей. Например, если мы хотим, чтобы имя обязательно было набрано заглавными буквами, можно написать такой `handleChange`:
7272

@@ -291,7 +291,7 @@ setTimeout(function() {
291291

292292
## Альтернативы контролируемым компонентам {#alternatives-to-controlled-components}
293293

294-
Использование контролируемых компонентов иногда может быть утомительным. Приходится писать обработчик события для каждого варианта изменения ваших данных и проводить всё состояние формы через компонент React. Это может особенно раздражать, если вы переносите существующую кодовую базу в React, или когда работаете над интеграцией React-приложения с другой библиотекой. В такой ситуации могут пригодиться [неконтролируемые компоненты](/docs/uncontrolled-components.html), альтернативная техника реализации ввода данных в форму.
294+
Использование контролируемых компонентов иногда может быть утомительным. Приходится писать обработчик события для каждого варианта изменения ваших данных и проводить всё состояние формы через компонент React. Это может особенно раздражать, если вы переносите существующую кодовую базу в React, или когда работаете над интеграцией React-приложения с другой библиотекой. В такой ситуации могут пригодиться [неконтролируемые компоненты](/docs/uncontrolled-components.html) альтернативная техника реализации ввода данных в форму.
295295

296296
## Полноценные решения {#fully-fledged-solutions}
297297

0 commit comments

Comments
 (0)