События и обработчики
Событие — сообщение о том, что пользователь что-то сделал: нажал кнопку, изменил поле, нажал клавишу. Обработчик (listener) — ваш код, который Vaadin вызывает на сервере в ответ. Обработчики обычно пишут лямбдами прямо в конструкторе экрана.
Нажатие кнопки
Обработчик можно передать в конструктор кнопки или добавить позже методом addClickListener:
// src/main/java/com/example/blog/views/DraftView.java (фрагмент конструктора)
Button publish = new Button("Опубликовать");
publish.addClickListener(event -> {
event.getSource().setEnabled(false);
Notification.show("Пост отправлен на публикацию");
});После нажатия кнопка становится серой и неактивной, а снизу появляется уведомление. event.getSource() возвращает кнопку, которую нажали.
Изменение значения
У каждого поля есть addValueChangeListener. Сделаем счётчик символов под полем текста:
// src/main/java/com/example/blog/views/DraftView.java
package com.example.blog.views;
import com.vaadin.flow.component.html.Span;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.component.textfield.TextArea;
import com.vaadin.flow.data.value.ValueChangeMode;
import com.vaadin.flow.router.Route;
@Route("draft")
public class DraftView extends VerticalLayout {
public DraftView() {
TextArea content = new TextArea("Текст");
Span counter = new Span("Символов: 0");
content.setValueChangeMode(ValueChangeMode.EAGER);
content.addValueChangeListener(event ->
counter.setText("Символов: " + event.getValue().length()));
add(content, counter);
}
}Пока пользователь печатает, надпись под полем меняется: «Символов: 5», «Символов: 6» и так далее. У события есть getValue() — новое значение и getOldValue() — прежнее.
Когда поле сообщает об изменении
Режим ValueChangeMode | Когда событие уходит на сервер |
|---|---|
ON_CHANGE | Пользователь ушёл из поля или нажал Enter (по умолчанию) |
EAGER | После каждого нажатия клавиши |
LAZY | Когда пользователь сделал паузу в наборе (по умолчанию 400 мс) |
TIMEOUT | Не чаще одного раза за заданный интервал |
Для поиска по таблице обычно выбирают LAZY: сервер не получает запрос на каждую букву.
Горячие клавиши
Кнопку можно нажимать с клавиатуры:
// src/main/java/com/example/blog/views/DraftView.java (фрагмент конструктора)
Button save = new Button("Сохранить", event -> Notification.show("Сохранено"));
save.addClickShortcut(Key.ENTER);Теперь Enter в любом месте экрана срабатывает как нажатие «Сохранить». Нужен импорт com.vaadin.flow.component.Key.
Отписка от события
Каждый add...Listener возвращает объект Registration. Вызов remove() отключает обработчик:
// src/main/java/com/example/blog/views/DraftView.java (фрагмент конструктора)
Registration registration = content.addValueChangeListener(event -> Notification.show("Изменено"));
registration.remove();Это нужно редко, чаще — когда подписываетесь на что-то, что живёт дольше экрана. Импорт: com.vaadin.flow.shared.Registration.
Частая ошибка
Счётчик не обновляется во время набора, а меняется только при уходе из поля. Причина — режим по умолчанию ON_CHANGE. Добавьте setValueChangeMode(ValueChangeMode.EAGER) или LAZY, если хотите реагировать на ввод сразу.