如何设置TextArea为只读且保持可滚动状态（Vaadin v20.0.1）

首先明确：setEnabled(false) 会禁用整个组件DOM节点，导致无法响应滚动事件，完全不适合本场景，只需要通过只读配置实现需求即可，以下是两种可行方案：

方案1：使用官方标准API（推荐） #

• 直接调用TextArea的自带方法即可实现需求，调用后组件保持原有滚动能力，仅禁止编辑：

textArea.setReadOnly(true);

• 如果你使用了Binder绑定表单字段，单独设置组件只读会不生效，需要同步设置Binder的只读状态：

// 绑定字段逻辑不变
binder.bindInstanceFields(this);
// 给特定角色设置只读时，同步设置Binder和组件
if (当前用户属于只读角色) {
    binder.setReadOnly(true);
    textArea.setReadOnly(true);
}

该方案完全符合Vaadin设计规范，不需要额外自定义配置，适配所有Vaadin v20+版本

方案2：强制设置原生DOM属性（兜底方案） #

如果方案1未生效（比如存在自定义扩展修改了组件默认行为），可以直接给TextArea的底层DOM元素设置原生readonly属性，100%生效：

// 设置只读
textArea.getElement().setAttribute("readonly", "");
// 取消只读
textArea.getElement().removeAttribute("readonly");

可选：自定义只读样式 #

如果不想要Vaadin默认的只读状态灰化效果，可以添加自定义CSS类调整样式：

1. 前端CSS代码：

vaadin-text-area.custom-readonly [part="input-field"] {
    background: var(--lumo-base-color);
    border: 1px solid var(--lumo-contrast-20pct);
    cursor: default;
}

2. Java端给组件添加样式类：

textArea.addClassName("custom-readonly");

内容的提问来源于stack exchange，提问作者mmo