flutter - Flutter - FutureBuilder - 搜索
问题描述
我正在为用户列表使用 FuturBuilder。我让用户通过 futur: fetchpost() 通过 API。在专栏的开头,我实现了一个搜索栏。那么如何实现我的 Searchbar 正在搜索呢?
Container(
child: FutureBuilder(
future: fetchPost(),
builder: (BuildContext context, AsyncSnapshot snapshot) {
if(snapshot.connectionState == ConnectionState.waiting) {
return Container(
child: ...CircularPro..(),
),
} else {
return Container(
child: Column(
children: <Widget>[
Padding(
child: TextField(
onChanged: (value) {
},
controller: searchController,
decoration: InputDecoration(
prefixIcon: Icon(Icons.search),
),
),
),
Expanded(
child: ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
return ListTile(
title: Text(
"[" +
snapshot.data[index].id + "] " +
snapshot.data[index].firstname + " " +
snapshot.data[index].lastname
),
subtitle: Text(snapshot.data[index].email),
解决方案
您需要为条件取一些变量,ListView
然后在搜索栏的提交事件上设置该变量的值,然后setState()
是小部件。
String searchString = "";
TextField(
onChanged: (value) {
setState((){
searchString = value;
});
},
controller: searchController,
decoration: InputDecoration(
prefixIcon: Icon(Icons.search),
),
),
ListView.builder(
itemCount: snapshot.data.length,
itemBuilder: (BuildContext context, int index) {
return snapshot.data[index].firstname.contains(searchString)? ListTile(
title: Text(
"[" +
snapshot.data[index].id + "] " +
snapshot.data[index].firstname + " " +
snapshot.data[index].lastname
),
subtitle: Text(snapshot.data[index].email),
...
:Container(),
推荐阅读
- android - Android Studio 问题 cmake
- r - 是否有一种有效的算法来创建这种类型的时间表?
- c# - 通过 EWS 在 Exchange 中删除 SharePoint 日历链接
- node.js - if/else 中的异步函数调用不返回值
- r - 在一个带有单独图例的图形中绘制两种图表类型(面积和线)
- python - 如何使用 Python 从 Selenium 中的列表中输入变量文本?
- php - 计算多维对象数组中的重复值
- python - Python:If-else 语句出错
- java - URL.setFileNameMap(FileNameMap map) 用于什么?
- powershell - Powershell 脚本到电子邮件的最后修改日期