带有 LitTemplate 的网格不一致地更新复选框
Grid with LitTemplate not updating checkbox consistently
我们正在更新网格表单以使用 LitTemplates 进行渲染。但是,我们 运行 遇到了一个问题,即即使状态的基础数据已更新,复选框状态也不会更新。以下代码演示了该问题:
HorizontalLayout hlTest = new HorizontalLayout();
List<String> selected = new ArrayList<>();
Grid<String> testGrid =new Grid<>();
testGrid.setWidth("250px");
testGrid.setHeight("250px");
List<String> dataList = new ArrayList<>(List.of("AAAAA", "BBBBB", "CCCCC", "DDDDD", "EEEEE"));
ListDataProvider<String> dataProvider = new ListDataProvider<>(dataList);
testGrid.setItems(dataProvider);
String template = """
<vaadin-checkbox @click="${handleCheckClick}" ?checked="${item.rowSelected}"></vaadin-checkbox>
<div>${item.text}</div>
""";
LitRenderer<String> lit = LitRenderer.of(template);
lit.withProperty("rowSelected", item -> {
boolean rc = selected.contains(item);
System.out.println("Item selected: " + item + " => " + rc);
return rc;
});
lit.withProperty("text",item -> item);
lit.withFunction("handleCheckClick", (item) -> {
if(selected.contains(item))
selected.remove(item);
else
selected.add(item);
});
testGrid.addColumn(lit);
Button bSelect = new Button("Select");
bSelect.addClickListener(buttonClickEvent -> {
if(selected.size() > 0)
{
dataList.clear();
dataList.addAll(selected);
selected.clear();
dataProvider.refreshAll();
}
});
hlTest.add(testGrid, bSelect);
使用给定的网格,单击几个复选框,然后单击 'Select'。该列表减少到 selected 行,但即使 'selected' 为空,复选框仍处于选中状态。 'rowSelected' 中的日志记录正确返回状态。
如果我删除该列并重新添加到网格,则所有内容都会正确显示。另外,如果我 select 网格中的所有项目,那么 select 也可以正常工作。
目前正在使用 Java17 和 Vaadin 22.0.6(也尝试过 23.0.0 beta3)。
谢谢。
我觉得你更新的时候需要调用dataProvider刷新
lit.withFunction("handleCheckClick", (item) -> {
if(selected.contains(item))
selected.remove(item);
else
selected.add(item);
testGrid().getDataProvider().refreshAll();
});
我们正在更新网格表单以使用 LitTemplates 进行渲染。但是,我们 运行 遇到了一个问题,即即使状态的基础数据已更新,复选框状态也不会更新。以下代码演示了该问题:
HorizontalLayout hlTest = new HorizontalLayout();
List<String> selected = new ArrayList<>();
Grid<String> testGrid =new Grid<>();
testGrid.setWidth("250px");
testGrid.setHeight("250px");
List<String> dataList = new ArrayList<>(List.of("AAAAA", "BBBBB", "CCCCC", "DDDDD", "EEEEE"));
ListDataProvider<String> dataProvider = new ListDataProvider<>(dataList);
testGrid.setItems(dataProvider);
String template = """
<vaadin-checkbox @click="${handleCheckClick}" ?checked="${item.rowSelected}"></vaadin-checkbox>
<div>${item.text}</div>
""";
LitRenderer<String> lit = LitRenderer.of(template);
lit.withProperty("rowSelected", item -> {
boolean rc = selected.contains(item);
System.out.println("Item selected: " + item + " => " + rc);
return rc;
});
lit.withProperty("text",item -> item);
lit.withFunction("handleCheckClick", (item) -> {
if(selected.contains(item))
selected.remove(item);
else
selected.add(item);
});
testGrid.addColumn(lit);
Button bSelect = new Button("Select");
bSelect.addClickListener(buttonClickEvent -> {
if(selected.size() > 0)
{
dataList.clear();
dataList.addAll(selected);
selected.clear();
dataProvider.refreshAll();
}
});
hlTest.add(testGrid, bSelect);
使用给定的网格,单击几个复选框,然后单击 'Select'。该列表减少到 selected 行,但即使 'selected' 为空,复选框仍处于选中状态。 'rowSelected' 中的日志记录正确返回状态。
如果我删除该列并重新添加到网格,则所有内容都会正确显示。另外,如果我 select 网格中的所有项目,那么 select 也可以正常工作。
目前正在使用 Java17 和 Vaadin 22.0.6(也尝试过 23.0.0 beta3)。
谢谢。
我觉得你更新的时候需要调用dataProvider刷新
lit.withFunction("handleCheckClick", (item) -> {
if(selected.contains(item))
selected.remove(item);
else
selected.add(item);
testGrid().getDataProvider().refreshAll();
});