[英]flutter_bloc BlocBuilder not rebuilding as well state change not observed in BlocObserver
[英]Checking bloc state with blocbuilder
我正在从 API 中获取项目列表并使用 BlocBuilder 构建它们。 它可以工作并且构建了小部件列表,但是当我打印出来检查 state 的哪个部分正在执行时,我得到如下所示。 为什么会出现“无”?
ProductInitial
fetching product //from bloc when fetching api
Nothing
fetching complete //from bloc after fetching api
ProductSuccess
主要的
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MultiBlocProvider(
providers: [
BlocProvider<ProductBloc>(
create: (BuildContext context) => ProductBloc()..add(FetchProduct())
),
],
child: MaterialApp(
debugShowCheckedModeBanner: false,
home: MainScreen(),
)
);
}
}
列表屏幕
Widget build(BuildContext context) {
return Container(
child: Padding(
padding: EdgeInsets.all(10.0),
child: BlocBuilder<ProductBloc, ProductState>(
builder: (context, state) {
if(state is ProductInitial){
print('ProductInitial');
return buildLoadingWidget();
}
if(state is ProductSuccess){
print('ProductSuccess');
return _buildProductListWidget(state.products);
}
if(state is ProductFailed){
print('ProductFailed');
return Center(
child: Text('Something went wrong'),
);
}
print('Nothing');
return buildLoadingWidget();
}
)
)
);
}
更新
添加了块代码以供参考。
集团
class ProductBloc extends Bloc<ProductEvent, ProductState> {
ProductBloc() : super(ProductInitial());
ProductRepository _repository = ProductRepository();
@override
Stream<ProductState> mapEventToState(ProductEvent event,) async* {
if(event is FetchProduct){
yield ProductLoading();
try{
print('fetching product');
final List<ProductModel> products = await _repository.getProducts();
yield ProductSuccess(products);
print('fetching complete');
}catch(e){
yield ProductFailed();
print(e);
print('fetching failed');
}
}
}
}
使用以下代码更新您的集团:
集团
class ProductBloc extends Bloc<ProductEvent, ProductState> {
ProductBloc() : super(ProductInitial());
ProductRepository _repository = ProductRepository();
@override
Stream<ProductState> mapEventToState(ProductEvent event,) async* {
if(event is FetchProduct){
yield ProductInitial();
try{
print('fetching product');
final List<ProductModel> products = await _repository.getProducts();
yield ProductSuccess(products);
print('fetching complete');
}catch(e){
yield ProductFailed();
print(e);
print('fetching failed');
}
}
}
}
在您的代码中,您正在 yield ProductLoading
state 但没有在 BlocBuilder 中处理 state 这就是它绕过所有 if 语句并打印Nothing的原因。
所以另一种方法是在你的块构建中处理ProductLoading
,如下所示
列表屏幕
Widget build(BuildContext context) {
return Container(
child: Padding(
padding: EdgeInsets.all(10.0),
child: BlocBuilder<ProductBloc, ProductState>(
builder: (context, state) {
if(state is ProductInitial){
print('ProductInitial');
return buildLoadingWidget();
}
if(state is ProductLoading){
print('ProductLoading');
return buildLoadingWidget();
}
if(state is ProductSuccess){
print('ProductSuccess');
return _buildProductListWidget(state.products);
}
if(state is ProductFailed){
print('ProductFailed');
return Center(
child: Text('Something went wrong'),
);
}
print('Nothing');
return buildLoadingWidget();
}
)
)
);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.