如何在 Vaadin 流 (Vaadin 14) 网格中创建一个可以在 ValueChangeEvent 中写回的 TextField？（不使用网格编辑器）答案

【问题标题】：How to create a TextField in Vaadin flow (Vaadin 14) Grid that could write back in ValueChangeEvent ? (not using Grid Editor)如何在 Vaadin 流 (Vaadin 14) 网格中创建一个可以在 ValueChangeEvent 中写回的 TextField？（不使用网格编辑器）
【发布时间】：2021-05-18 07:53:51
【问题描述】：

我正在尝试将 TextField 作为可编辑组件放在 Grid 的每一行中。但我不知道如何在 ValueChange 事件中回写？

下面是我的代码

    SerializableBiConsumer<emisTextField, PO_DETL_GRID> consumer =
        (tf , detl) ->{ 
            tf.setValue( detl.getP_NO());               
    } ; 
    SerializableSupplier<emisTextField> ss = () -> {
        emisTextField tf =new emisTextField();
        tf.addValueChangeListener(c->{
        
            //how to write back newValue to my PO_DETL_GRID item ?
                
        });
        return tf;
    };
    ComponentRenderer cr = new ComponentRenderer<emisTextField,PO_DETL_GRID>(ss,consumer);
    
    Grid.Column p_no_column = edit_grid.addColumn( cr);
    
    grid.addColumn(cr);

【问题讨论】：

标签： vaadin vaadin14

【解决方案1】：

你可以使用这个替代构造函数：

SerializableFunction<MyItem, TextField> function = item -> {
    TextField tf = new TextField();
    tf.setValue(item.getMyValue());
    tf.addValueChangeListener(e -> item.setMyValue(e.getValue()));
    return tf;
};
ComponentRenderer<TextField, MyItem> cr = new ComponentRenderer<>(function);

【讨论】：

非常感谢。我的工作版本。 SerializableFunction function = item -> { emisTextField tf = new emisTextField(); tf.setValue(item.getP_NO()); tf.addValueChangeListener(e -> { item.setP_NO(tf.getValue()); });返回 tf; };