Vaadin Dataprovider：如何避免 "auto-fetch"？

Question

下面回答用例 1，用例 2 已移至单独的问题 ()

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

至少有两个用例：

除非用户提供过滤器参数，否则显示网格数据没有意义
return 到 @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(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$requestFlushf364bb9(DataCommunicator.java:425)
        at com.vaadin.flow.internal.StateTree.lambda$runExecutionsBeforeClientResponse(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 是：当 return 到 GridView 时，GridView 应该与之前的状态完全相同（与 TextField 一起工作正常）。

打开GridView -> 网格不应填充数据
输入过滤器参数（代码中未显示）
点击“刷新”填充网格
在TextField“stateCheck”中输入“蜘蛛侠”
切换到EmptyView
在真实应用中：在 EmptyView 和可能的其他视图中做一些事情
return 到 GridView -> 网格应该 不重新加载数据 ，它应该保持原样 - 就像 [=32] =] 仍然显示“蜘蛛侠”，网格应显示与之前相同的数据，无需重新加载。

Answer 1

对于情况 1：在回调中检查您是否有过滤器参数，return如果没有则为空集。使用新的 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) or https://vaadin.com/docs/v14/flow/binding-data/tutorial-flow-data-provider (V14)

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

Answer 2

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

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

Vaadin Dataprovider：如何避免 "auto-fetch"？

Vaadin Dataprovider: how to avoid "auto-fetch"?

vaadin

vaadin-grid

vaadin-flow