flutter 局部数据刷新
时间: 2024-08-07 19:00:41 浏览: 50
在Flutter中,局部数据刷新通常通过`StreamBuilder`实现[^2],它可以基于实时流(如网络请求)来触发特定部件的更新。`StreamBuilder`的工作原理是在后台维护一个流,当数据源有变化时,它会自动重新构建其依赖的部分。这有助于避免全局刷新,提高用户体验。
以下是一个简单的`StreamBuilder`示例:
```dart
import 'package:flutter/material.dart';
import 'dart:async';
class LocalRefreshExample extends StatefulWidget {
@override
_LocalRefreshExampleState createState() => _LocalRefreshExampleState();
}
class _LocalRefreshExampleState extends State<LocalRefreshExample> {
StreamController<int> controller = StreamController<int>.broadcast();
// 模拟从服务器获取的数据
Future<void> fetchData() async {
await Future.delayed(Duration(seconds: 2));
final newData = 10; // 更新的数据
setState(() { // 当数据发生变化时,调用setState更新视图
controller.add(newData);
});
}
@override
Widget build(BuildContext context) {
return StreamBuilder<int>(
stream: controller.stream,
builder: (context, snapshot) {
if (!snapshot.hasData) {
return CircularProgressIndicator(); // 加载中...
}
return Text('最新数据: ${snapshot.data}'); // 显示最新的数据
},
onRefresh: () { // 触发数据加载
fetchData();
},
);
}
}
```
在这个例子中,当你点击刷新按钮时(`onRefresh`),`fetchData`会被调用并模拟数据更新,从而触发`Text`组件的更新,只显示新的数据,而不会刷新整个页面。
阅读全文