【问题标题】:Filter ListView with FutureBuilder?用 FutureBuilder 过滤 ListView?
【发布时间】:2021-10-22 08:42:01
【问题描述】:

如何将此代码升级为搜索列表视图? 我尝试使用两个列表并使用 where 关键字,但它不起作用。将数据填充到列表中的一些问题,然后打印它总是显示的列表Instance of User

class ListBuilder extends StatefulWidget {
  final FetchList fetchList;

  ListBuilder({required this.fetchList});

  @override
  _ListBuilderState createState() => _ListBuilderState();
}

class _ListBuilderState extends State<ListBuilder> {

  @override
  Widget build(BuildContext context) {
    return FutureBuilder(
      future: widget.fetchList.getUsers(),
      builder: (BuildContext context, AsyncSnapshot snapshot) {
        if (snapshot.data == null) {
          return LoadingView();
        } else {
          if (snapshot.data.length > 0) {
            return Column(
              children: [
                Padding(
                  padding: const EdgeInsets.all(12.0),
                  child: TextField(
                    // onChanged: onItemChanged,
                    // controller: _textController,
                    decoration: InputDecoration(
                      hintText: 'Search Here by EmployeeId...',
                    ),
                  ),
                ),
                Expanded(
                  child: ListView.builder(
                    itemCount: snapshot.data.length,
                    itemBuilder: (BuildContext context, int index) {
                      return UserListTile(user: snapshot.data[index]);
                    },
                  ),
                ),
              ],
            );
          } else {
            return EmptyView();
          }
        }
      },
    );
  }
}

这里使用 JSON 数据和 Flutter FutureBuilder 构建此列表视图。

【问题讨论】:

  • 我认为 snapshot.data[index] 只是索引用户的整个对象或实例。尝试添加您尝试访问的名称。 snapshot.data[index]['nameOfEmployee'] 或 snapshot.data[index].nameOfEmployee.
  • 如果它显示Instance of...,则将toString() 方法添加到该类。你必须找到你正在寻找的对象。所以要么给你的 API 调用一些参数(widget.fetchList.getUsers()),要么先存储这个列表,然后把你不需要的东西扔掉。
  • 参考我的回答here我用过listview.builder和FutureBuilder希望对你有帮助
  • 非常感谢您的 cmets。

标签: json list flutter flutter-futurebuilder flutter-listview


【解决方案1】:

我建议通过适当的状态管理来做这些事情。虽然您当然可以在小部件中实现这一点,但它会以设计不佳的应用程序告终。在使用 BLoC 的过滤器的待办事项列表中查看此 brief tutorial。然后是一个从网络读取数据的过滤列表示例。我相信这更有意义,并且不那么难学

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-01-17
    相关资源
    最近更新 更多