Vaadin Dataprovider：如何避免“自动获取”？

如何解决Vaadin Dataprovider：如何避免“自动获取”？

用例 1 的回答如下，用例 2 已移至单独的问题 (Vaadin Flow: Returning to a view,the view should not reload data from the backend)

我想使用由惰性 DataProvider 支持的 Vaadin Flow (v14 LTS/v19) 网格组件，该组件不会在显示网格时自动从后端获取数据。

至少有两个用例：

除非用户提供过滤参数，否则显示网格数据没有意义
返回到带有 @PreserveOnRefresh 标记的视图不应将显示的数据替换为当前数据。（在更新中进一步阐述）

作为 Vaadin 14+ 的新手，我不知道如何实现这一点。每次显示我的 GridView 时，都会查询 DataProvider 的 count 和 fetch 回调。调用源自网格的 DataCommunicator。

那么对于用例 1：如何阻止 DataProvider 获取没有意义的数据？对于用例 2：如何防止在第二次向 UI 中添加网格时覆盖网格状态？

非常感谢！

StackTrace 到我的提取回调（Vaadin Flow 14）：

        at org.vaadin.example.GridView.fetch(GridView.java:46)
        at org.vaadin.example.GridView.lambda$new$c4b2c115$1(GridView.java:23)
        at com.vaadin.flow.data.provider.CallbackDataProvider.fetchFromBackEnd(CallbackDataProvider.java:137)
        at com.vaadin.flow.data.provider.AbstractBackEndDataProvider.fetch(AbstractBackEndDataProvider.java:61)
        at com.vaadin.flow.data.provider.DataCommunicator.fetchFromProvider(DataCommunicator.java:362)
        at com.vaadin.flow.data.provider.DataCommunicator.activate(DataCommunicator.java:647)
        at com.vaadin.flow.data.provider.DataCommunicator.collectKeysToFlush(DataCommunicator.java:589)
        at com.vaadin.flow.data.provider.DataCommunicator.flush(DataCommunicator.java:461)
        at com.vaadin.flow.data.provider.DataCommunicator.lambda$requestFlush$2f364bb9$1(DataCommunicator.java:425)
        at com.vaadin.flow.internal.StateTree.lambda$runExecutionsBeforeClientResponse$2(StateTree.java:390)
        at [java.util.stream] omitted
        at com.vaadin.flow.internal.StateTree.runExecutionsBeforeClientResponse(StateTree.java:387)
        at com.vaadin.flow.server.communication.UidlWriter.encodeChanges(UidlWriter.java:411)
        at com.vaadin.flow.server.communication.UidlWriter.createUidl(UidlWriter.java:187)
        at com.vaadin.flow.server.communication.UidlRequestHandler.writeUidl(UidlRequestHandler.java:122)
        at com.vaadin.flow.server.communication.UidlRequestHandler.synchronizedHandleRequest(UidlRequestHandler.java:91)
        at com.vaadin.flow.server.SynchronizedRequestHandler.handleRequest(SynchronizedRequestHandler.java:40)
        at com.vaadin.flow.server.VaadinService.handleRequest(VaadinService.java:1547)
        at com.vaadin.flow.server.VaadinServlet.service(VaadinServlet.java:247)
        at javax.servlet.http.HttpServlet.service(HttpServlet.java:790)

更新20210430 这是我的 GridView 的代码，它也伪造了后端 DataProvider：

@Route(value = "grid",layout = MainView.class)
public class GridView extends VerticalLayout {
    public GridView() {
        final Grid<Person> g = new Grid(Person.class);
        g.setColumns("name");
        g.setDataProvider(DataProvider.fromCallbacks(q -> fetch(q),q -> count(q)));
        add(g);
        // filter omitted
        final Button refresh = new Button("refresh");
        refresh.addClickListener(e -> {
            System.out.println("refresh clicked");
            g.getDataProvider().refreshAll();
        });
        add(refresh);

        add(new TextField("State check"));
    }

    // fake DataProvider
    private int count(Query<Person,Void> q) { return 3; }

    private Stream<Person> fetch(Query<Person,Void> q) {
        q.getLimit(); //vaadin checks these have been called
        q.getOffset(); //vaadin checks these have been called
        System.out.println("fetching again");
        new Exception().printStackTrace(); //figure out who called
        return Arrays.asList(new Person("1"),new Person("2"),new Person("3")).stream();
    }
}

我的MainView用于在GridView和EmptyView之间切换

@PreserveOnRefresh
public class MainView extends AppLayout {

    private Component emptyBView;
    private Component gridBView;

    public MainView() {
        final Button emptyB = new Button("Btn empty");
        emptyB.addClickListener(e -> {
            if (emptyBView == null) { emptyBView = new EmptyView();}
            setContent(emptyBView);
        });
        addToNavbar(emptyB);

        final Button gridB = new Button("Btn grid");
        gridB.addClickListener(e -> {
            if (gridBView == null) gridBView = new GridView();
            setContent(gridBView);
        });
        addToNavbar(gridB);
    }
}

MainView 是一个 AppLayout，用于将 AppLayout 的内容从 GridView 切换到 EmptyView 并返回。

用例 2 是：当返回到 GridView 时，GridView 应该与之前的状态完全相同（这适用于 TextField）。

open GridView -> 网格不应填充数据
输入过滤器参数（代码中未显示）
点击“刷新”以填充网格
在TextField“stateCheck”中输入“蜘蛛侠”
切换到EmptyView
在真实应用中：在 EmptyView 和可能的其他视图中执行某些操作
返回 GridView -> 网格应该不重新加载数据，它应该保持原样 - 就像 TextField 仍然显示“蜘蛛侠”一样，网格应显示与以前相同的数据，而无需重新加载。

解决方法

对于案例 1：在回调中检查您是否有过滤器参数，如果没有则返回一个空集。使用新的 V17+ API，它看起来像这样：


grid.setItems(query -> {
    if(filterParameters.isEmpty()) {
      // Return an empty stream
    } else {
      // Fetch from backend
    }
});

您可以在此处的文档中阅读更多内容：https://vaadin.com/docs/latest/flow/binding-data/data-provider (V19) 或 https://vaadin.com/docs/v14/flow/binding-data/tutorial-flow-data-provider (V14)

我需要更多关于您目前正在做什么的信息来帮助解决案例 2。您如何构建视图，您的代码是什么样的？带有“Caused by”的完整堆栈跟踪也会有所帮助。

我建议只在设置第一个过滤器参数后将 DataProvider 设置为 Grid。客户端 Grid 期望从 fetch 查询中接收它需要的项目数；如果您不提供来自 fetch 的请求数量的项目，它可能在某些极端情况下工作，但它的设计目的并非如此。

请注意，这特别适用于在 Vaadin 14 系列中使用带有过滤器的 DataProviders - Vaadin 17 引入了一种新的可选简化获取项目的方式，这稍微改变了这个等式。它尚未向后移植到 Vaadin 14（目前计划用于 14.7）。

Vaadin Dataprovider：如何避免“自动获取”？

如何解决Vaadin Dataprovider：如何避免“自动获取”？

解决方法

相关推荐