vaadin - Vaadin 21 中的 ComboBox 不显示任何项目

Question

我正在尝试使用带有 Vaadin 21 的 ComboBox。即使我使用了不同的填充变体，组合框也不会填充项目。也未设置占位符。ComboBox 仍然带有虚线轮廓（我猜这意味着禁用）。

public class EventFormLayout extends HorizontalLayout {

    private final EventRepository eventRepository;

    private final ComboBox<String> timezone = new ComboBox<>("Timezone");;

    private Button cancel = new Button("Cancel");
    private Button save = new Button("Save");

    private Binder<Event> binder = new Binder(Event.class);

    @Autowired
    public EventFormLayout(Event event, EventRepository eventRepository) {
        this.eventRepository = eventRepository;

        ListDataProvider<String> tzDataProvider = DataProvider.ofCollection(ZoneId.getAvailableZoneIds());
        timezone.setLabel("Timezone");

        timezone.setItems(tzDataProvider);
        //timezone.setItems(ZoneId.getAvailableZoneIds());
        //timezone.setItems("UTC", "Europe/Berlin", "Europe/Paris");
        timezone.setPlaceholder("Timezone");
        timezone.setReadOnly(false);
        timezone.setEnabled(true);

        add(createTitle());
        add(createFormLayout());
        add(createButtonLayout());

        binder.bindInstanceFields(this);
        clearForm();

        cancel.addClickListener(e -> clearForm());
        save.addClickListener(e -> {
            eventRepository.save(binder.getBean());
            clearForm();
        });
    }

    private void clearForm() {
        binder.setBean(new Event());
    }

    private Component createTitle() {
        return new H3("Event");
    }

    private Component createFormLayout() {
        FormLayout formLayout = new FormLayout();
        formLayout.add(title, text, year, month, day, time, timezone);
        return formLayout;
    }

    private Component createButtonLayout() {
        HorizontalLayout buttonLayout = new HorizontalLayout();
        buttonLayout.addClassName("button-layout");
        save.addThemeVariants(ButtonVariant.LUMO_PRIMARY);
        buttonLayout.add(save);
        buttonLayout.add(cancel);
        return buttonLayout;
    }

}

实体看起来像这样：

@Component
public class Event {

    @Transient @Getter
    private String timezone;

    public String setTimezone(String timezone) {
        this.timezone = timezone;
        return this.timezone;
    }

}

该属性是瞬态的，因为在我的实际类中，我对值做了一些事情并将其保存到另一个属性，但是它是瞬态的这一事实与问题无关，我已经尝试过了。

标签： vaadinvaadin-flowvaadin21

Answer 1

这种情况下的问题是，setter 返回了一些东西。这打破了自动绑定。现在有两种方法可以修复它：要么让 setter 不返回任何内容，要么显式绑定属性，

binder.forField(timezone).bind(Event::getTimezone, Event::setTimezone);
// before
binder.bindInstanceFields(this);