Vaadin 返回组件值

Vaadin returning the component values

我在 Vaadin 的表单中工作,我想检索组件中选择的所有值,但它们总是空的。

这是 class 组件被定义并存储在 ArrayLIst 中以发送到项目的另一个 classes 和方法。

public class MainView extends Div {

    ProjectConfiguration configuration = new ProjectConfiguration();

    private final List<String> visualizationList = new ArrayList<>(Arrays.asList("FAST", "REAL TIME"));
    private final List<String> resolutionList = new ArrayList<>(Arrays.asList("320 x 200", "640 x 400"));
    private final List<String> audioRate = new ArrayList<>(Arrays.asList("44100", "48000"));

    public void ShowForm() {

        ComboBoxs comboResolution = new ComboBoxs(resolutionList,"Video resolution","Select a resolution for the exported video");
        ComboBoxs comboVideoVisualization = new ComboBoxs(visualizationList,"Export visualization", "Select the visualization of the video export");
        ComboBoxs comboAudioRate = new ComboBoxs(audioRate,"Audio rate", "Select the audio rate for the video export");
        CheckStats checkStats = new CheckStats();
        ArrayList<Div> fieldValues = new ArrayList<Div>();
        fieldValues.add(comboResolution);
        fieldValues.add(comboVideoVisualization);
        fieldValues.add(comboAudioRate);
        fieldValues.add(checkStats);
        SubmitButton submitButton = new SubmitButton(configuration, fieldValues);
    }
}

并且此提交按钮正在将此配置写入全局 POJO class。

public class SubmitButton extends Div {

public SubmitButton(ProjectConfiguration configuration, ArrayList<Div> fields) {
    Button submitButton = new Button("Create video");

    submitButton.addClickListener(clickEvent -> {
        submitConfiguration(configuration, fields);
    });
    add(submitButton);
}
private void submitConfiguration(ProjectConfiguration configuration, ArrayList<Div> fields) {
    new FieldGetter(configuration, fields);
}
}

同样的实例,如果我将它发送到此 class 之外的新方法,我总是得到一个空值。

public class FieldGetter {

    public FieldGetter(ProjectConfiguration configuration, ArrayList<Div> fields, String exportFileName) {
        log.info("Text 1 " + fields.get(0).getText());
        log.info("Text 2 " + fields.get(1).getText());
        log.info("Text 3 " + fields.get(2).getText());
        log.info("Text 4 " + fields.get(3).getText());
}}

所有这些组件都有信息。选中所有 ComboBox,然后单击 Stats。 我做错了什么?我需要使用哪种方法来获得选择。 非常感谢。


我正在按照要求添加已实施的组合框 class。

@Route("combo")
public class ComboBoxs extends Div {

    public ComboBoxs(List<String> arrayList, String label, String helperText) {
        ComboBox<String> comboBox = new ComboBox<>(label);
        comboBox.setAllowCustomValue(true);
        comboBox.addCustomValueSetListener(e -> {
            String customValue = e.getDetail();
            arrayList.add(customValue);
            comboBox.setItems(arrayList);
            comboBox.setValue(customValue);
        });
        add(comboBox);
        comboBox.setItems(arrayList);
        comboBox.setHelperText(helperText);
    }
}

您的 FieldGetter 看错地方了。这些 Div 没有设置文本(这可能是您假设 comboBox.setValue(customValue) 会发生的情况)。

总的来说,你的代码有点绕。您不需要所有这些 Div 和抽象。

尝试

public class HelloWorldView extends HorizontalLayout {

private final List<String> visualizationList = new ArrayList<>(Arrays.asList("FAST", "REAL TIME"));

public HelloWorldView() {
    ComboBox<String> comboBox = new ComboBox<>("Visualisation");
    comboBox.setAllowCustomValue(true);
    comboBox.addCustomValueSetListener(e -> {
        String customValue = e.getDetail();
        visualizationList.add(customValue);
        comboBox.setItems(visualizationList);
        comboBox.setValue(customValue);
    });
    add(comboBox);
    comboBox.setItems(visualizationList);

    Button printValues = new Button("Print");
    printValues.addClickListener(e -> {
        System.out.println(Arrays.toString(visualizationList.toArray(new String[0])));
        System.out.println("Value is now:"+ comboBox.getValue() );
    });
    comboBox.addValueChangeListener(e-> System.out.println("Value changed from "  + e.getOldValue() + " to " + e.getValue()));
    add(printValues);        }       }

开始,程序(我用的是start.vaadin.com的启动器),select“FAST”,然后删除“FAST”,输入“Slow”并点击 .然后点击打印按钮。

输出将如下所示:

值从 null 更改为 FAST
值从 FAST 更改为 null
值从 null 更改为 Slow
[快速、实时、慢速]
值为 now:Slow

希望对您有所帮助!