我目前有一个简单的 API,但如果不重新启动整个应用程序,我的 flutter 小部件无法检测到 API 中发生的更改。
API 是在 https://www.mockable.io/ 上作为测试 API 制作的.我设法使用 StreamBuilder 从这个 API 读取数据.每当我在 API 中更新它们的值时,它仍然不会更改小部件中的值。
默认 JSON
{
"id": "123",
"token": "1token",
"status": "Valid"
}
值变化后
{
"id": "123",
"token": "1token",
"status": "Not Valid"
}
我的 StreamBuilder 代码
import 'package:flutter/material.dart';
import 'dart:async';
import 'dart:convert';
import 'package:http/http.dart' as http;
final String url = "http://demo2722084.mockable.io/user";
class StreamPage extends StatefulWidget {
@override
StreamPageState createState() {
return new StreamPageState();
}
}
class StreamPageState extends State<StreamPage> {
StreamController _userController;
Future fetchUser() async{
final response = await http.get(url);
if(response.statusCode == 200){
return json.decode(response.body);
}else{
print("Exception caught: Failed to get data");
}
}
loadUser() async{
fetchUser().then((res) async{
_userController.add(res);
return res;
});
}
@override
void initState() {
_userController = new StreamController();
loadUser();
super.initState();
}
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("Stream"),
),
body: new StreamBuilder(
stream: _userController.stream,
builder: (context, snapshot){
if(snapshot.hasError){
print("Exception: ${snapshot.error}");
}
if(snapshot.hasData){
var user = snapshot.data;
var id = user["id"] ?? "";
var token = user["token"] ?? "";
var status = user["status"] ?? "";
return new Center(
child: new ListTile(
title: new Text("Token: $token"),
subtitle: new Text("Status: $status"),
leading: new Text(id),
),
);
}
if(snapshot.connectionState != ConnectionState.waiting){
return new Center(
child: new CircularProgressIndicator(),
);
}
if(!snapshot.hasData && snapshot.connectionState != ConnectionState.done){
return new Center(
child: new CircularProgressIndicator(),
);
}
},
),
);
}
}
我希望 StreamBuilder 获取更改后的 status 值,但必须重新启动应用才能使新值反射(reflect)在应用中。
是否有一个示例可以说明我如何正确地实现这一点,因为坦率地说,这是我第一次尝试 StreamBuilder。
最佳答案
您的 HTTP 请求只会产生一个数据点,因此您可以使用 FutureBuilder
。但是您想知道服务器什么时候发生变化。进行更改时您的 HTTP 连接已完成,因此不知道它已经发生。
有几种方法可以检测服务器端的变化,例如,轮询、用户启动的刷新、websockets 等。出于演示目的,而不是在 initState中调用
你可以启动一个 1 秒的周期性定时器来做到这一点,它会每秒更新一次流,你应该会看到变化。 (不要忘记在 loadUser
dispose
中取消计时器。)
这在生产中不太可能可行,因此请探索 websockets 等,以获取来自网络服务器的推送通知。另请探索 Firebase 云消息传递是否是向您的应用程序发送更改通知的更好方式。
@override
void initState() {
super.initState();
_userController = StreamController();
Timer.periodic(Duration(seconds: 1), (_) => loadUser());
}
关于dart - Flutter:检测 API 中的变化,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54139571/