Vaadin(Flow):使用共享库导航到目标 [英] Vaadin (Flow): Navigating to destination with a shared object

问题描述

我目前有一个显示SomeModel类型内容的网格. 当我单击该Grid的条目时，我想导航到一个以对象作为其输入的视图，以显示条目的内容.

I currently have a grid that displays content of type SomeModel. When I click an entry of that Grid I would like to navigate to a view that takes an object as its input to display the entries content.

为实现此行为，我创建了一个如下的DetailLayout:

To achive this behaviour I created a DetailLayout like this:

public DetailLayout extends FlexLayout implements HasUrlParameter<SomeModel>{
    /* skipped some details */
    @Override
    public void setParameter(BeforeEvent event, Host parameter) {
        /* This is where I expected to be able to handle the object */
    }
}

在Grid中，我尝试这样导航:

From within the Grid I tried to navigate like this:

addSelectionListener((event) -> {
    event.getFirstSelectedItem().ifPresent(somemodel -> {
        getUI().ifPresent(ui -> {
            ui.navigate(DetailLayout.class, somemodel);
        });
    });
});

但不幸的是，即使Vaadin的语法非常好，这种行为也不受Vaadin支持.

But unfortunately this behaviour is not supported by Vaadin even tho its syntax is perfectly fine.

您是否知道导航时传递对象的另一种方法，还是我错过了官方文档的某些部分?

Do you know of another way to pass an object while navigation or did I miss a certain part of the official documentation documentation ?

提前谢谢

推荐答案

键值集合

如其他答案的注释中所述，如果您不希望将ID值公开为URL，然后使用Vaadin提供的键值集合在后台工作.

Key-Value collection

As discussed in the comments on the other Answer, if you do not wish to expose the ID value as part of the URL, then work behind the scenes by using the key-value collection provided by Vaadin.

Vaadin实际上提供了三个范围级别的键值集合:

Vaadin actually provides key-value collections at three levels of scope:

• 上下文
  您的整个Web应用在运行时
• 会话
  每个用户
• UI
  每个Web浏览器窗口/标签，因为Vaadin支持多窗口Web应用程序

通过getAttribute和可以在VaadinContext上找到应用程序范围的键值集合. setAttribute方法.

The app-wide key-value collection is available on the VaadinContext, via getAttribute & setAttribute methods.

VaadinService.getCurrent().getContext().setAttribute( key , value ) ;

每个用户的键值集合可通过getAttribute和getAttribute在VaadinSession上使用. setAttribute方法.

The per-user key-value collection is available on the VaadinSession, via getAttribute & setAttribute methods.

VaadinSession.getCurrent().setAttribute( key , value ) ;

➥每个浏览器窗口/选项卡的集合(本课题中您希望满足的需求)并不是那么容易获得.您必须经历一个间接步骤.在 ComponentUtil 类中，请调用setData& getData方法.除了

➥ The per-browser-window/tab collection (what you want for your needs in this Question) is not quite so readily available. You have to go through an indirect step. On the ComponentUtil class, call setData & getData methods. In addition to passing your key and your value, pass the current UI object.

Component c = UI.getCurrent() ;
String key = "com.example.acmeapp.selectedProductId" ;
Object value = productId ;
ComponentUtil.setData( c , key , value ) ;

---

请投票给我的机票#6287 ，该功能要求添加<UI类上的c6>/getAttribute方法，以匹配VaadinSession和VaadinContext的方法.

---

Please vote for my ticket # 6287, a feature-request to add setAttribute/getAttribute methods on UI class, to match those of VaadinSession and VaadinContext.

这篇关于Vaadin(Flow):使用共享库导航到目标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！