在本地更新FutureBuilder ListView

时间:2019-09-16 14:29:57

标签: flutter

我正在使用 FutureBuilder 从API获取数据,该API返回在 ListView.builder

中绘制的列表

然后有一个 TextField ,我用它来搜索过滤实体。我如何访问将来获取的数据?还是应该通过覆盖 initState 将它们存储在本地?我也想通过我的searchfilter更新列表,而不用对我做 setState()时发生的API另一个GET。

@override
  Widget build(BuildContext context) {
    return Material(
      child: Column(
        children: <Widget>[
          Padding(
              padding: EdgeInsets.only(
            top: MediaQuery.of(context).size.height * 0.05,
          )),
          TextField(
            decoration: InputDecoration(
                labelText: "Search", prefixIcon: Icon(Icons.search)),
            controller: searchField,
            onChanged: (value) {
              filterSearchResults(value.toLowerCase());
            },
          ),
          Expanded(
            child: FutureBuilder(
              future: _getCustomers(),
              builder: (context, snapshot) {
                if (snapshot.connectionState == ConnectionState.done) {
                  return ListView.builder(
                      itemCount: snapshot.data.length,
                      itemBuilder: (context, index) {
                        return Card(
                            elevation: 5,
                            child: ListTile(
                              leading: const Icon(
                                Icons.account_circle,
                                size: 45,
                              ),
                              title: Text(
                                  "${snapshot.data[index].firstName} ${snapshot.data[index].lastName}"),
                              subtitle:
                                  Text("${snapshot.data[index].socialNumber}"),
                              onTap: () {
                                Navigator.push(
                                    context,
                                    MaterialPageRoute(
                                        builder: (context) => CustomerPage(
                                            customer: snapshot.data[index])));
                              },
                            ));
                      });
                } else if (snapshot.hasError) {
                  //handle this
                  return null;
                } else {
                  return CircularProgressIndicator();
                }
              },
            ),
          ),
        ],
      ),
    );
  }

1 个答案:

答案 0 :(得分:0)

由于数据存储在列表中,然后由于queryString而被修改,所以解决方案只能在初始化时调用getCustomers:

  Future<List<Customer>> getCustomers;

  @override
  void initState() {
      getCustomers = _getCustomers();
      super.initState();
  }

  ...
  child: FutureBuilder(
      future: getCustomers,
  ...

然后将列表也保存在本地对象中,并在

之后使用
  

setState((){});

可以使用其他if语句完成

      if (items.length > 0) {
        return ListView.builder(
            itemCount: items.length,
            itemBuilder: (context, index) {
                ....
            });
      } else if (snapshot.connectionState ==
          ConnectionState.done) {
            return ListView.builder(
                itemCount: items.length,
                itemBuilder: (context, index) {
                    ....
                });

其中item是本地列表,除了第一次使用API​​中的列表然后将其存储在本地之外,都会使用该本地列表。