Flutter bloc:更新状态不会重新调用 BlocBuilder
Flutter bloc: updating the state does not re-call BlocBuilder
我有一个页面正在使用 bloc
进行管理
这里是 home_state.dart
import 'package:banha/data/models/category.dart';
import 'package:flutter/material.dart';
abstract class HomeState {
HomeState() : super();
}
class HomeInitial extends HomeState {}
class UpdateCats extends HomeState {
final List<Category> cats;
final int rand;
UpdateCats({@required this.cats,@required this.rand}){
print(this.cats);
print(this.rand);
}
}
和home_bloc.dart
(注意:随机数只是为了确保状态与前一个不同)
import 'dart:math';
import 'package:banha/data/models/category.dart';
import 'package:banha/data/network/categories.dart';
import 'package:banha/ui/tabs/home/bloc/home_events.dart';
import 'package:banha/ui/tabs/home/bloc/home_states.dart';
import 'package:bloc/bloc.dart';
class HomeBloc extends Bloc<HomeEvents, HomeState> {
getAllCats() {
dispatch(HomeGetCategories());
}
HomeBloc() : super();
@override
HomeState get initialState => HomeInitial();
@override
Stream<HomeState> mapEventToState(HomeEvents event) async* {
if (event is HomeGetCategories) {
yield* _getCats();
}
}
Stream<HomeState> _getCats() async* {
print("getting cats");
List<Category> newCats;
await Network_getAllCategories().then((List<Category> cats) {
newCats = cats;
});
yield UpdateCats(cats: newCats, rand: Random().nextInt(21312545));
}
}
和页面小部件:
import 'package:banha/ui/category/category.dart';
import 'package:banha/ui/tabs/home/bloc/home_bloc.dart';
import 'package:banha/ui/tabs/home/bloc/home_states.dart';
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
class ListingsWidget extends StatefulWidget {
@override
_ListingsWidgetState createState() => _ListingsWidgetState();
}
class _ListingsWidgetState extends State<ListingsWidget> {
final HomeBloc _homeBloc = HomeBloc();
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Container(
height: 130,
padding: EdgeInsets.only(top: 10, bottom: 10),
child: BlocListener(
bloc: _homeBloc,
listener: (context, state) {
print(state);
},
child: BlocBuilder<HomeBloc, HomeState>(
bloc: _homeBloc,
builder: (BuildContext context,HomeState state) {
if(state is UpdateCats){
print(state.cats);
}
return ListView(
scrollDirection: Axis.horizontal,
children: <Widget>[
InkWell(
borderRadius: BorderRadius.circular(1000),
onTap: () {
HomeBloc().getAllCats();
// Navigator.push(context, CupertinoPageRoute(builder: (context) => CategoryPage()));
},
....
问题是在视图(Widget)中,BlocBuilder 仅在初始时被调用一次,但是当我尝试使用 HomeBloc().getAllCats();
测试更改状态然后使用此代码打印新状态时:
if(state is UpdateCats){
print(state.cats);
}
没有任何反应(不再调用 Builder),我的代码有什么问题?
我将 BlocProvider
添加到根小部件(即主页)并解决了问题。
问题在这里:
...
onTap: () {
...
HomeBloc().getAllCats();
...
},
...
应该是_homeBloc.getAllCats();
我有一个页面正在使用 bloc
进行管理这里是 home_state.dart
import 'package:banha/data/models/category.dart';
import 'package:flutter/material.dart';
abstract class HomeState {
HomeState() : super();
}
class HomeInitial extends HomeState {}
class UpdateCats extends HomeState {
final List<Category> cats;
final int rand;
UpdateCats({@required this.cats,@required this.rand}){
print(this.cats);
print(this.rand);
}
}
和home_bloc.dart
(注意:随机数只是为了确保状态与前一个不同)
import 'dart:math';
import 'package:banha/data/models/category.dart';
import 'package:banha/data/network/categories.dart';
import 'package:banha/ui/tabs/home/bloc/home_events.dart';
import 'package:banha/ui/tabs/home/bloc/home_states.dart';
import 'package:bloc/bloc.dart';
class HomeBloc extends Bloc<HomeEvents, HomeState> {
getAllCats() {
dispatch(HomeGetCategories());
}
HomeBloc() : super();
@override
HomeState get initialState => HomeInitial();
@override
Stream<HomeState> mapEventToState(HomeEvents event) async* {
if (event is HomeGetCategories) {
yield* _getCats();
}
}
Stream<HomeState> _getCats() async* {
print("getting cats");
List<Category> newCats;
await Network_getAllCategories().then((List<Category> cats) {
newCats = cats;
});
yield UpdateCats(cats: newCats, rand: Random().nextInt(21312545));
}
}
和页面小部件:
import 'package:banha/ui/category/category.dart';
import 'package:banha/ui/tabs/home/bloc/home_bloc.dart';
import 'package:banha/ui/tabs/home/bloc/home_states.dart';
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
class ListingsWidget extends StatefulWidget {
@override
_ListingsWidgetState createState() => _ListingsWidgetState();
}
class _ListingsWidgetState extends State<ListingsWidget> {
final HomeBloc _homeBloc = HomeBloc();
@override
void initState() {
super.initState();
}
@override
Widget build(BuildContext context) {
return Container(
height: 130,
padding: EdgeInsets.only(top: 10, bottom: 10),
child: BlocListener(
bloc: _homeBloc,
listener: (context, state) {
print(state);
},
child: BlocBuilder<HomeBloc, HomeState>(
bloc: _homeBloc,
builder: (BuildContext context,HomeState state) {
if(state is UpdateCats){
print(state.cats);
}
return ListView(
scrollDirection: Axis.horizontal,
children: <Widget>[
InkWell(
borderRadius: BorderRadius.circular(1000),
onTap: () {
HomeBloc().getAllCats();
// Navigator.push(context, CupertinoPageRoute(builder: (context) => CategoryPage()));
},
....
问题是在视图(Widget)中,BlocBuilder 仅在初始时被调用一次,但是当我尝试使用 HomeBloc().getAllCats();
测试更改状态然后使用此代码打印新状态时:
if(state is UpdateCats){
print(state.cats);
}
没有任何反应(不再调用 Builder),我的代码有什么问题?
我将 BlocProvider
添加到根小部件(即主页)并解决了问题。
问题在这里:
...
onTap: () {
...
HomeBloc().getAllCats();
...
},
...
应该是_homeBloc.getAllCats();