You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: src/content/reference/react-dom/components/select.md
+5-5Lines changed: 5 additions & 5 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -36,15 +36,15 @@ title: "<select>"
36
36
37
37
#### Пропсы {/*props*/}
38
38
39
-
`<select>` поддерживает все [пропсы общих HTML-элементов.](/reference/react-dom/components/common#props)
39
+
`<select>` поддерживает все [общие пропсы HTML-элементов.](/reference/react-dom/components/common#props)
40
40
41
41
Можно сделать [поле выбора управляемым](#controlling-a-select-box-with-a-state-variable), передав проп `value`:
42
42
43
43
*`value`: строка (или массив строк для [`multiple={true}`](#enabling-multiple-selection)). Управляет выбранным вариантом. Значение каждой строки `value` соответствует некоторому `<option>`, вложенному в `<select>`.
44
44
45
45
При передаче `value`, также необходимо передать обработчик `onChange`, который будет отвечать за обновление переданного значения.
46
46
47
-
Если `<select>`является неуправляемым, то нужно передать проп `defaultValue`:
47
+
Если не передать `value`, то `<select>`считается неуправляемым, и нужно использовать проп `defaultValue`:
48
48
49
49
*`defaultValue`: строка (или массив строк для [`multiple={true}`](#enabling-multiple-selection)). Указывает [значение по умолчанию.](#providing-an-initially-selected-option)
50
50
@@ -71,7 +71,7 @@ title: "<select>"
71
71
- В отличие от HTML, передача атрибута `selected` в `<option>` не поддерживается. Вместо этого используется [`<select defaultValue>`](#providing-an-initially-selected-option) для неуправляемого поля выбора и [`<select value>`](#controlling-a-select-box-with-a-state-variable) для управляемого.
72
72
- Если поле выбора принимает проп `value`, то оно будет [считаться управляемым.](#controlling-a-select-box-with-a-state-variable)
73
73
- Поле выбора не может быть одновременно управляемым и неуправляемым.
74
-
- Поле выбора не может переключаться между управляемым и неуправляемым состоянием в течении своего жизненного цикла.
74
+
- Поле выбора не может переключаться между управляемым и неуправляемым состоянием в течение своего жизненного цикла.
75
75
- Каждому управляемому полю выбора требуется обработчик событий `onChange`, который синхронно обновляет его исходное состояние.
76
76
77
77
---
@@ -109,7 +109,7 @@ select { margin: 5px; }
109
109
110
110
### Предоставление метки для поля выбора {/*providing-a-label-for-a-select-box*/}
111
111
112
-
Обычно, каждый `<select>` размещают внутри тега [`<label>`](https://developer.mozilla.org/ru/docs/Web/HTML/Element/label). Это сообщает браузеру, что данная метка связана с этим полем выбора. Когда пользователь нажмёт на метку, браузер автоматически установит фокус на поле выбора. Это также важно для доступности: когда пользовательский фокус будет на поле выбора, скринридер озвучит заголовок метки.
112
+
Обычно каждый `<select>` размещают внутри тега [`<label>`](https://developer.mozilla.org/ru/docs/Web/HTML/Element/label). Это сообщает браузеру, что данная метка связана с этим полем выбора. Когда пользователь нажмёт на метку, браузер автоматически установит фокус на поле выбора. Это также важно для доступности: когда пользовательский фокус будет на поле выбора, скринридер озвучит заголовок метки.
113
113
114
114
Если вы не можете вложить `<select>` в `<label>`, то свяжите их, передав некоторый ID в `<select id>` и [`<label htmlFor>`.](https://developer.mozilla.org/en-US/docs/Web/API/HTMLLabelElement/htmlFor) Чтобы избежать конфликтов между несколькими экземплярами одного компонента, сгенерируйте такой ID с помощью хука [`useId`.](/reference/react/useId)
Чтобы пользователь мог выбрать несоклько вариантов, нужно передать `multiple={true}` в `<select>`. В этом случае, если также указать `defaultValue` для выбора вариантов по умолчанию, то это должен быть массив.
193
+
Чтобы пользователь мог выбрать несколько вариантов, нужно передать `multiple={true}` в `<select>`. В этом случае, если также указать `defaultValue` для выбора вариантов по умолчанию, то это должен быть массив.
0 commit comments