我們當前使用的是 Vaadin Flow 版本 12.0.7（由于某些原因我們無法升級），并且我們希望覆蓋 ComboBox 組件的過濾機制。我的意思是，當用戶在組合框內輸入輸入時，我們希望更改組合框后面的項目的搜索方式。我正在查看Vaadin 文檔，了解如何實現組合框的自定義過濾。更具體地說，該部分Filtering by a string看起來很有希望。根據 Vaadin 文檔，我們實現了一個自定義接口來適應 ComboBox 的搜索方法：public interface CustomerDataFilter {? ? List<Customer> fetch(int offset, int limit, String filterText);? ? int getCount(String filterText);}這非常簡單，并且與文檔示例幾乎 1:1 匹配。然后，我們根據文檔創建了一個方法，用數據填充 ComboBox。文檔中也幾乎使用了 1:1：private DataProvider<Customer, String>createDepartmentDataProvider(CustomerDataFilter service){? ?return DataProvider.fromFilteringCallbacks(query -> {? ? ? ?// getFilter returns Optional<String>? ? ? ?String filter = query.getFilter().orElse(null);? ? ? ?return service.fetch(query.getOffset(),? ? ? ? ? ? ? ?query.getLimit(), filter).stream();? ?}, query -> {? ? ? ?String filter = query.getFilter().orElse(null);? ? ? ?return service.getCount(filter);? ?});}我們在初始化 ComboBox 的數據時調用上述方法。此時我們還實現了接口（盡管這可能很難看）。然而我們不太確定如何使用這兩個接口方法。我們的第一個目標是始終返回所有項目并忽略任何特定過濾，這就是我們sorted始終返回整個列表的原因。這只是為了測試目的，嘗試我們是否更改了過濾。public void updateCustomerList() {? ? List<Customer> sorted = CustomerService.getInstance().findAll();? ? //for initial sorting? ? sorted.sort(new CustomerComperator());? ? DataProvider<Customer, String> test = createDepartmentDataProvider(new CustomerDataFilter() {? ? ? ? @Override? ? ? ? public int getCount(String filterText) {? ? ? ? ? ? return 0;? ? ? ? }? ? ? ? @Override? ? ? ? public List<Customer> fetch(int offset, int limit, String filterText) {? ? ? ? ? ? return sorted;? ? ? ? }? ? });? ? customerCompany.setItems(sorted);? ? customerCompany.setDataProvider(test);}我們嘗試將該getCount值增加到1，但一旦我們將其設置為高于0以下異常，就會發生：The number of items returned by the data provider exceeds the limit specified by the query (1).我們的猜測是，我們必須以某種方式調整getCount和fetch方法，以便它們實現我們的自定義搜索。這不會有問題，因為我們有 ComboBox 和filterText. 我們怎么有點困惑為什么我們getCount還需要一個方法以及如何繞過顯示的異常？我們的想法是讓getCountalways 返回like10并fetch返回我們列表中sorted關于filterText.任何人都可以詳細說明/幫助我們如何實現組合框的自定義過濾或為我們指出正確的軌道嗎？
1 回答
阿波羅的戰車
TA貢獻1862條經驗 獲得超6個贊
您走在正確的軌道上，但您需要首先了解概念DataProvider。
在客戶端（瀏覽器），一旦用戶與其進行交互，Vaadin 就會請求將數據顯示在組合框中。請求的數據類似于“數據中有多少項？”?這是計數查詢。假設您有 100 件商品?，F在，下一個請求是“給我要顯示的前 40 個項目”，這是獲取查詢。組合框將顯示返回的項目。一旦用戶向下滾動列表，就會發出另一個數據請求“給我接下來要顯示的 40 個項目”等。
總而言之，DataProvider首先要求返回所有項目的計數，然后根據需要逐頁獲取數據。當用戶輸入過濾器時這也適用。不同之處在于您的計數和獲取查詢應考慮過濾器。
示例：用戶輸入了過濾器“xyz”，現在只有 50 個項目與此過濾器匹配（通過名稱或其他內容），因此您將在 count 方法中返回 50，并且您的 fetch 方法應該相應地進行過濾。
您遇到的異常只是指出您的 fetch 方法返回的項目多于 Vaadin 請求的項目（查詢參數中的“limit”參數）。這是因為您當前不處理偏移/限制。
您有兩種選擇來實施您的數據提供程序：
使用列表數據提供者
Vaadin 提供了for 列表ListDataProvider的實現DataProvider。分頁已經在實現中完成了，你不必關心它。使用該filteringBy方法根據輸入的過濾文本過濾數據。
這種方式更容易，但不可擴展。這意味著如果您有很多項目，您將消耗大量內存和 CPU，因為整個數據都是從后端檢索到列表中的。如果您預計商品數量較少，請采用此方法。
或者實現您自己的 DataProvider
您可以實現自己的DataProvider.?我建議從擴展AbstractBackendDataProvider類（javadoc）開始。方法sizeInBackend和fetchFromBackend需要實施。請注意在 fetch 方法中實現分頁的偏移/限制參數。
如果您將分頁委托給數據庫（例如 SQL 或 no-sql 數據庫），則此方法是可擴展的。內存占用會很低，因為您只在內存中保留一頁。
添加回答
舉報
0/150
提交
取消