Flutter Web Searchfield 在文本输入后不会过滤建议中的结果

Question

我正在尝试搜索列表> partyList，其中每个地图都存储有关派对的信息。我按如下方式实现了搜索字段。

Padding(
                              padding: const EdgeInsets.only(bottom: 10),
                              child: SearchField<Map<String, dynamic>>(
                                onSearchTextChanged: (query) {
                                  final filter = partyListDoc
                                      .where((element) =>
                                      element['partyName'].toLowerCase().contains(query.toLowerCase()))
                                      .toList();
                                  return filter
                                      .map((party) =>
                                      SearchFieldListItem<Map<String, dynamic>>(
                                        party['partyName'],
                                        item: party,
                                        child: Row(
                                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                          children: [
                                            Text(party['partyName']),
                                            Text(
                                              party['currentBalance'].toString(),
                                              style: TextStyle(
                                                color: party['currentBalance'] < 0 ? Colors.red : Colors.green,
                                              ),
                                            ),
                                          ],
                                        ),
                                      ))
                                      .toList();
                                },
                                suggestions: partyListDoc.map((party) {
                                  return SearchFieldListItem<Map<String, dynamic>>(
                                    party['partyName'],
                                    item: party,
                                    child: Row(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                      children: [
                                        Text(party['partyName']),
                                        Text(
                                          party['currentBalance'].toString(),
                                          style: TextStyle(
                                            color: party['currentBalance'] < 0 ? Colors.red : Colors.green,
                                          ),
                                        ),
                                      ],
                                    ),
                                  );
                                }).toList(),
                                suggestionState: Suggestion.expand,
                                textInputAction: TextInputAction.next,
                                hint: 'Search by Party Name',
                                searchStyle: TextStyle(
                                  fontSize: 18,
                                  color: Colors.black.withOpacity(0.8),
                                ),
                                validator: (x) {
                                  if (x == null || x.isEmpty) {
                                    return 'Please enter a party name';
                                  }
                                  return null;
                                },
                                searchInputDecoration: InputDecoration(
                                  border: OutlineInputBorder(),
                                ),
                                maxSuggestionsInViewPort: 6,
                                itemHeight: 50,
                                onSuggestionTap: (SearchFieldListItem<Map<String, dynamic>> suggestion) {
                                  setState(() {
                                    selectedPartyId = suggestion.item!['partyId'];
                                  });
                                  focus.unfocus();
                                },
                                focusNode: focus,
                              )
                            ),

在搜索字段中输入文本后，它会短暂过滤结果，然后再次显示整个列表。如何在建议中只显示过滤后的结果。

我尝试删除和修改onSearchTextChange，但结果是一样的。

Answer 1

我认为你只需要建议参数，而不是 onSearchFieldChanged 。在文档的示例中，他们似乎展示了您的用例：

SearchField<Country>(
  suggestions: countries
    .map(
    (e) => SearchFieldListItem<Country>(
      e.name,
      item: e,
      // Use child to show Custom Widgets in the suggestions
      // defaults to Text widget
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Row(
          children: [
            CircleAvatar(
              backgroundImage: NetworkImage(e.flag),
            ),
            SizedBox(
              width: 10,
            ),
            Text(e.name),
          ],
        ),
      ),
  ),
  ).toList(),
),

来源：https://pub.dev/packages/searchfield