textArea 文本域

基本用法

当输入可能跨越多行（例如评论或描述）时，请使用 textArea。

text area basic 
<textArea label="Comment"
          value="Great job. This is excellent!"/>

如果未设置固定高度，textArea 会根据内容自动调整高度。默认高度和最小高度是两行文字。

数据绑定

在线示例

数据绑定是指将可视化组件与数据容器相关联。这样可视化组件或数据容器的变更都会触发彼此的更新。参考 使用数据组件。

数据感知的 textArea 示例：

<textArea id="textArea" label="Order description"
          dataContainer="orderDc"
          property="description"/>

确保需要绑定的实体属性为字符串类型。与 textField 文本框 不同，textArea 是专门为处理文本数据而设计的。

样式版本

通过 themeNames 属性调整文本对齐方式、帮助文本显示位置以及组件的大小。

对齐

有三个选项：align-left（默认）、align-right、align-center。

text area alignment
XML 代码 
<textArea themeNames="align-left"/>
<textArea themeNames="align-center"/>
<textArea themeNames="align-right"/>

帮助文本显示位置

设置 helper-above-field 可以将帮助文本从默认的组件下方显示位置移至组件上方。

text area helper text position
XML 代码 
<textArea label="Text area label" helperText="Helper text"/>
<textArea themeNames="helper-above-field" label="Text area label" helperText="Helper text"/>

尺寸

有两个选项：默认大小和 small。

text area size
XML 代码 
<textArea/>
<textArea themeNames="small"/>

XML 属性

通用属性 对所有组件都是一样的配置。 下面是 textArea 的特殊属性：

名称

描述

默认值

autoselect

设置为 true 时，当字段获得焦点则自动选中字段值。

–

maxRows

设置最大行数。

–

minRows

设置最小行数。

2

trimEnabled

如果为 true，组件会去除输入内容开头和结尾的空格。例如：" aaa bbb " 将被保存为 "aaa bbb"。

可以使用 jmix.ui.component.default-trim-enabled 属性在应用程序级别内配置该设置。

–

事件和处理器

通用事件和处理器 对所有组件都是一样的配置。 下面是 textArea 的特殊事件和处理器：

在 Jmix Studio 生成处理器桩代码时，可以使用 Jmix UI 组件面板的 Handlers 标签页或者视图类顶部面板的 Generate Handler 添加，也可以通过 Code → Generate 菜单（Alt+Insert / Cmd+N）生成。

名称

描述

validator

为组件添加一个 验证器 实例。

参考

Vaadin 文档。