在网格行上单击（“详细信息”）后，如何打开新的Vaadin网格？

Question

在父网格上单击“详细信息” /行时，我试图以“网格”格式（从列表中）显示数据。

按照vaadin网站（https://vaadin.com/components/vaadin-grid/java-examples/item-details）上的示例，基本上是尝试在“”中显示“网格”格式的数据，该数据在单击“详细信息”时打开，其来源为“不同”列表。

换句话说，有两个列表 1人 2.汽车（属于人-一对多关系）

第一个父网格是个人。现在，点击行/详细信息，要显示“”内属于一个人的所有“汽车”，最好以网格格式显示。

我正在考虑使用TemplateRenderer的各种可能性，但无法确定DIV中的迭代。 下面是示例代码，左侧的注释指示我要在哪里添加第二个网格（在单击详细信息后打开的DIV内）

注意：我们欢迎任何其他建议（而不是详细信息/行点击路径），以提供更好的用户体验，以查看“详细信息”

public class MainView extends VerticalLayout {

  Grid<User> grid1;

  Grid<Car> grid2;
     public MainView() {

    List<User> users = BatchUtils.getUsers();

    List<Car> cars = BatchUtils.getCars();

    grid1 = new Grid<>(User.class);

    //---to be opened in details section
    grid2= new Grid<>(Car.class);
    grid2.setItems(cars);


    ListDataProvider<User> dataProvider = new ListDataProvider<>(users);
    grid1.setDataProvider(dataProvider);

    grid1.setSelectionMode(Grid.SelectionMode.NONE);

    // You can use any renderer for the item details. By default, the
    // details are opened and closed by clicking the rows.
    grid1.setItemDetailsRenderer(TemplateRenderer.<User>of(
        "<div class='custom-details' style='border: 1px solid gray; padding: 10px; width: 100%; box-sizing: border-box;'>"
            + "<div>Hi! My name is <b>[[item.name]]!</b></div>" + "</div>")
                                                .withProperty("Name", User::getName)
                                                // This is now how we open the details
                                                .withEventHandler("handleClick", user -> {
                                                  grid1.getDataProvider()
                                                      .refreshItem(user);
                                                }));

    //****** trying somehow add grid2 from list of CARS *******************

    // Disable the default way of opening item details:
    grid1.setDetailsVisibleOnClick(false);

    grid1.addColumn(new NativeButtonRenderer<>("Details",
        item -> grid1.setDetailsVisible(item, !grid1.isDetailsVisible(item))));
    add(grid1);   } }