搜索栏结果在颤动中自动刷新答案

【问题标题】：Search bar result automatically refresh in flutter搜索栏结果在颤动中自动刷新
【发布时间】：2021-05-30 13:22:18
【问题描述】：

每当我使用搜索栏过滤结果时，它会在显示过滤结果 2 秒后自动刷新数据（显示结果后显示所有列表）。如何阻止它自动刷新？

这是我在视图中打印结果的代码：

     Expanded(
              child: FutureBuilder<List<categories_all>>(
                  future: fetchhome(),
                  builder: (context, snapshot) {
                    if (snapshot.hasData) {
                      List<categories_all> data = snapshot.data;
                      datalist = snapshot.data;
                      return Container(
                        margin: EdgeInsets.only(top: 10.0),
                          child:category_list_view(
                              shippingToList: data)
                      );
                    } else if (snapshot.hasError) {
                      return Text("${snapshot.error}");
                    }
                    return Container(
                        alignment: Alignment.center,
                        width: scU.scale(60),
                        height: scU.scale(60),
                        child: CircularProgressIndicator(
                          valueColor: AlwaysStoppedAnimation<Color>(
                              kCircularProgressIndicatorColor),
                        ));
                  }),
            ),

搜索栏在用户更改文本值时执行更改的功能

          child: TextField(

                // onChanged: (text) {
                //   text = text.toLowerCase();
                //   filter(text);
                //
                // },
                style: TextStyle(
                    fontSize: scU.scale(11),
                    color: Color.fromRGBO(237, 204, 147, 1),
                    fontWeight: FontWeight.w500),
                textAlign: TextAlign.start,
                keyboardType: TextInputType.text,
                onChanged: (value) {
                  filterSearchResults(value);
                },

                decoration: new InputDecoration(
                  isDense: true,
                  border: InputBorder.none,


                  errorBorder: InputBorder.none,
                  disabledBorder: InputBorder.none,
                  hintText: "Search Rings, Necklaces",

                  prefixIcon: const Icon(
                    Icons.search,
                    color: Color.fromRGBO(237, 204, 147, 1),
                  ),

                  hintStyle: TextStyle(
                    fontFamily: 'Satisfy-Regular',
                    fontSize: scU.scale(9.5),


                    color: parseColor("#edcc93"),
                  ),



                ),
              )

filtered method: 该方法用于过滤搜索结果

void filterSearchResults(String query) {
                       List<categories_all> dummySearchList = List<categories_all>();
                       dummySearchList.addAll(datalist);
         if(query.isNotEmpty) {
           List<categories_all> dummyListData = List<categories_all>();
             dummySearchList.forEach((item) {
               if(item.name.contains(query)) {
               dummyListData.add(item);
               }
                });
           setState(() {
             datalist.clear();
             datalist.addAll(dummyListData);
           });
       return;
      }

     }

【问题讨论】：

我不明白你想做什么。您是说希望过滤搜索的返回值延迟 2 秒？

标签： flutter dart flutter-layout uisearchbar dart-html

【解决方案1】：

在您的FutureBuilder 中设置：future: fetchhome()。假设这会创建一个新的Future，您应该将您的小部件设为StatefulWidget，并在initState() 内调用此方法一次，并将生成的Future 存储在State 类的变量中.

build() 应该没有副作用（即它不应该修改状态）。这是因为您无法控制何时调用 build()。例如，如果用户打开键盘或更改为横向，则可能会导致重建。

状态对象的寿命更长，如果小部件没有太大变化（即runtimeType 和key 与前一帧相同），状态对象将保持不变，initState() 不会被再次调用。这使它成为开始异步工作（如网络调用）的好地方。

【讨论】：