vaadin-grid - Vaadin 每 30 秒基于 API 调用自动刷新网格数据

Question

我需要每 30 秒调用一次 API，并且需要用更新的数据刷新网格。我使用服务器推送，但在我的情况下找不到最佳解决方案。下面是我的用户界面代码

@Route(value = UserNavigation.ROUTE)
@PreserveOnRefresh
@org.springframework.stereotype.Component
public class UserNavigation extends AppLayout {

CCUIConfig config;

    @Autowired
    public UserNavigation( CCUIConfig config) {
    this.config = config;

    addToDrawer(createAccordianMenu());
    }

    private Component createAccordianMenu() {
    VerticalLayout scrollableLayout = new VerticalLayout();

    Div kioskMonitor_div = new Div(kiosksMonitorLabel);
    kioskMonitor_div.addClickListener(event -> {
            try {
                setContent(new Monitor(config).getDashboard());
            } catch (Exception e) {
                e.printStackTrace();
            }
        });
    scrollableLayout.add(kioskMonitor_div);
    return scrollableLayout;
    }
}


@Push
@Route
public class Monitor extends VerticalLayout{
    

    CCUIConfig config;
    Grid<Model> grid = new Grid<>();
    private FeederThread thread;
    

    public Monitor(CCUIConfig config) {
        this.config = config;
    }
   @Override
    protected void onAttach(AttachEvent attachEvent) {
        // Start the data feed thread
        super.onAttach(attachEvent);
        thread = new FeederThread(attachEvent.getUI(),grid);
        thread.start();
    }
   @Override
    protected void onDetach(DetachEvent detachEvent) {
        thread.interrupt();
        thread = null;
    }

    public  Component getDashboard() throws IOException{
        
        String updateddate =null;

        VerticalLayout dashboardview = new VerticalLayout();
        
        Grid.Column<Model> idColumn = grid.addColumn(Model::getid)
                .setHeader(ID);
        Grid.Column<Model> nameColumn = grid.addColumn(Model::getName)
                .setHeader(Name);
        Grid.Column<Model> memoryColumn = grid.addColumn(Model::getRefreshTime)
                .setHeader(Refresh time"));
        
        dashboardview.add(grid);
        return dashboardview;   
}
}
    


class FeederThread extends Thread {
    private final com.vaadin.flow.component.UI ui;
    private  final  Grid<Model>  grid;
    private final CCUIConfig config;

    private int count = 30;


    public FeederThread(com.vaadin.flow.component.UI ui,Grid<Model> grid) {
        this.config = new CCUIConfig();
        this.ui = ui;
        this.grid= grid;
    }

    @Override
    public void run() {
        while (count>0){
            try {
                Thread.sleep(1000);
                ui.access(()-> {
                    System.out.println("Thread Entry ");
                    try {
                    StringBuilder jsongrid = HttpClientGetRequestClient.executeUrlGet(config.getRefreshAPI());
                    ObjectMapper mapper = new ObjectMapper();
                    List<Model> userlist = new ArrayList<Model>();
                    String date="";
                    if(jsongrid!=null)
                    {
                    ModelWrapper eh = mapper.readValue(jsongrid.toString(), ModelWrapper.class);
                    userlist = eh.getMetricsData();
                    }
                                        
                    if(userlist != null)
                    {
                    grid.setItems(userlist);                
                    grid.getDataProvider().refreshAll();
                    }
                    }catch(JSONException |JsonProcessingException e) {
                        
                        e.printStackTrace();
                    } 

                });
                count--;
            } catch (InterruptedException e) {
                e.printStackTrace();
            }


        }
    }

}

UserNavigation 是用户登录后加载的页面，它包含一个带有多个选项（或功能）的侧边栏。其中一项功能是监控屏幕。Monitor 是带有网格的页面，我们需要在 30 秒内刷新它。FeederThread 是调用 API 并异步更新网格中数据的线程类。

从上面的代码来看，发生的事情是这样的

onAttach(AttachEvent attachEvent)

没有得到执行，所以网格没有显示在页面上，我们使用 vaadin 14，任何帮助将不胜感激。

标签： vaadin-gridvaadin14