【发布时间】：2020-11-30 12:00:47
【问题描述】：
我希望我的应用程序创建一个 ListView.builder，其中包含从后端 API 获取的用户数据以及提供程序和 http 包。
提供者获取数据的方法（现在可以正常工作）：
Future<List<User>> fetchUsersList() async {
var resp = await UserService().getAllUsers();
if (resp.statusCode == 200) {
return userListFromJson(resp.body);
} else {
decodeErrorMessage(resp);
return _usersList = [];
}
}
我的创建 ListView.builder 的代码：
class _StaffViewState extends State<StaffView> {
bool _searchaMode = false;
bool _fetchingData = false;
List<User> _userList = List<User>();
@override
Widget build(BuildContext context) {
Provider.of<UserProvider>(context).fetchUsersList().then(
(data) => this._userList = data);
return Consumer<UserProvider>(
builder: (context, providerData, _) => Scaffold(
appBar: AppBar(
title: _searchaMode == false
? Text('Staff\s List')
: TextField(
autofocus: true,
cursorColor: Colors.white,
onSubmitted: (String value) async {
await showDialog<void>(
context: context,
builder: (BuildContext context) {
return AlertDialog(
title: const Text('Thanks!'),
content: Text('You typed "$value".'),
actions: <Widget>[
FlatButton(
onPressed: () {
Navigator.pop(context);
},
child: const Text('OK'),
),
],
);
},
);
},
style: TextStyle(
color: Colors.white,
),
decoration: InputDecoration(
hintText: 'Search . . .',
hintStyle: TextStyle(color: Colors.white),
border: InputBorder.none,
),
),
actions: [
_searchaMode == false
? IconButton(
onPressed: () {
setState(() {
_searchaMode = true;
});
},
icon: Icon(Icons.search),
)
: IconButton(
onPressed: () {
setState(() {
_searchaMode = false;
});
},
icon: Icon(
Icons.cancel,
color: Colors.tealAccent,
),
),
RaisedButton.icon(
onPressed: () async {},
color: Colors.yellow.shade900,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(100.0),
topLeft: Radius.circular(100.0),
),
),
icon: Icon(
Icons.add,
size: 25.0,
color: Colors.white,
),
label: Text(
'Add User',
style: TextStyle(
fontSize: 15.0,
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
],
),
drawer: AppSideNav(),
body: _fetchingData == true
? pr.show()
: ListView.builder(
itemCount: _userList.length,
itemBuilder: (context, index) {
return Container(
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
width: .9,
color: Colors.yellow.shade700,
),
),
),
child: ListTile(
leading: Image.network(
providerData.getUsersList()[index].image != null
? providerData.getUsersList()[index].image
: 'https://via.placeholder.com/150'),
title: Center(
child:
Text(providerData.getUsersList()[index].email)),
subtitle: Center(
child: Text(providerData.getUsersList()[index].nid)),
trailing:
providerData.getUsersList()[index].isAuthority == true
? Text('Authority')
: providerData.getUsersList()[index].isStaff ==
true
? Text('Staff')
: Text('General User'),
contentPadding: EdgeInsets.symmetric(horizontal: 20.0),
visualDensity: VisualDensity.adaptivePlatformDensity,
isThreeLine: false,
onTap: () {},
),
);
},
),
),
);
}
}
正在加载我的数据以构建列表。但问题是发生了一个错误，说 在构建过程中调用了 setState() 或 markNeedsBuild()。
我的问题是使用提供程序包填充数据的实际方法是什么，首先执行 dataFetching 方法，然后构建列表。
【问题讨论】：
标签： flutter flutter-dependencies flutter-provider flutter-listview