TextArea

Быстрый старт​

Live Editor
Result
Open in CodeSandbox

Управление внешним видом​

Внешний вид компонента зависит от свойств appearance, view, size.

Доступные значения appearance: default, viewMode.

appearance="viewMode" — режим просмотра.

Live Editor
Result
Open in CodeSandbox

Размеры компонента​

Высоту и ширину можно регулировать с помощью свойств height и width, указав значения в rem или соответствующие свойствам css значения. height и width отвечают за всю высоту и ширину компонента.

Live Editor
Result
Open in CodeSandbox

Свойства rows и cols указываются в абсолютных единицах, отвечают за фиксированное количество строк и столбцов.

Live Editor
Result
Open in CodeSandbox

Autoresize​

Также можно включить автоматическое регулирование высоты поля ввода по длине контента внутри (параметра value). Для этого необходимо использовать свойство autoResize.

Свойства minAuto, maxAuto указываются в абсолютных единицах и отвечают за минимальное и максимальное количество строк.

Live Editor
Result
Open in CodeSandbox

Подсказки​

Для вывода подсказки снизу от поля используйте свойство leftHelper и/или rightHelper, для подсказки в виде Tooltip - hintText, для подсказки сверху справа - titleCaption:

Live Editor
Result
Open in CodeSandbox

Обязательность поля​

tip

Наличие индикатора регулируется свойством hasRequiredIndicator.

Обязательность поля задаётся с помощью свойства required. Если поле является обязательным, то у компонента появляется специальный индикатор. Изменить расположение индикатора можно с помощью свойства requiredPlacement, которое принимает значения left и right.

Live Editor
Result
Open in CodeSandbox

Слот для контента над вводимым текстом​

Слот для контента над вводимым текстом задается с помощью свойства headerSlot:

Live Editor
Result
Open in CodeSandbox

API​