Vaadin 24.7中LitRenderer使用vaadin-checkbox事件无响应求助

问题分析 #

在Vaadin 24.7.0版本中，使用LitRenderer为Grid添加<vaadin-checkbox>列时，注册的changed函数无法被触发，而原生<input type="checkbox">可以正常工作，且该场景在24.3.x版本中无异常。这是由于新版本中Web组件事件机制或LitRenderer函数绑定逻辑的调整导致的。

解决方案 #

正确绑定事件与行数据 #

需要显式传递当前行的item对象（LitRenderer默认将当前行数据暴露为item变量），并使用<vaadin-checkbox>的标准checked-changed事件，同时正确获取事件参数中的选中值：

final LitRenderer<Row> litRenderer = LitRenderer.<Row>of(
    "<vaadin-checkbox @checked-changed=${(e) => changed(e.detail.value, item)}></vaadin-checkbox>"
);
litRenderer.withFunction("changed", (row, args) -> {
    boolean checkedValue = args.getBoolean(0);
    Row currentRow = args.get(1);
    System.out.println("Row: " + currentRow.getId() + " Current value: " + checkedValue);
});
addColumn(litRenderer);

关键调整点 #

• 使用@checked-changed事件：这是<vaadin-checkbox>用于监听选中状态变化的标准事件，替代旧版本中可能兼容的@change事件。
• 显式传递item：确保函数能关联到当前行数据，避免因上下文丢失导致函数不触发。
• 正确获取参数：通过e.detail.value获取选中状态值，这是Vaadin Web组件事件传递参数的标准方式。

验证替代写法 #

如果上述方式仍有问题，可尝试使用@click事件作为临时替代（注意：此方式会在点击组件任意区域时触发，不如checked-changed精准）：

final LitRenderer<Row> litRenderer = LitRenderer.<Row>of(
    "<vaadin-checkbox @click=${(e) => changed(e.target.checked, item)}></vaadin-checkbox>"
);
litRenderer.withFunction("changed", (row, args) -> {
    boolean checkedValue = args.getBoolean(0);
    Row currentRow = args.get(1);
    System.out.println("Row: " + currentRow.getId() + " Current value: " + checkedValue);
});
addColumn(litRenderer);

内容的提问来源于stack exchange，提问作者user2266051