android Flutter- BloC Cubit函数未发出状态

vptzau2j  于 2023-04-04  发布在  Android
关注(0)|答案(5)|浏览(162)

我正在创建一个Flutter应用程序。我添加了一个BloC到我的项目中用于管理状态。我创建了一个包含数据的列表。我想使用“添加”按钮手动将项目添加到ListView。
我写了一个代码:

我的物品库

class ItemCubit extends Cubit<List<Item>> {
  ItemCubit() : super([]);

  void addItem(item){
    state.add(item);
    emit(state);
  }
}

提供商项目页

class SearchPage extends StatelessWidget {
  const SearchPage({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: BlocProvider(
        create: (_) => ItemCubit(),
        child: Search(),
      ),
    );
  }
}

我在Stateless Widget中这样调用BlocBuilder:

body: BlocBuilder<MarketCubit, List<Market>>(
            builder: (context, items) => TabBarView(...))

所以当我从state调用函数时:

Item item = Item(1, 'Item 1');

ElevatedButton(onPressed:(){
  context.read<ItemCubit>().addItem(item);
 }, child: Text('Add Item')),

ListView不更新了,有什么问题吗?谢谢!

wrrgggsh

wrrgggsh1#

问题是,您只是将项添加到状态并重新发出相同的项在调用emit时,list. Bloc将检查state对象的值,以确定它是否是一个新对象(),如果它是和最后一个状态‘相同的列表’,它就什么都不做了,这是令人困惑的,因为尽管你是在给列表添加一个新的值,但它在某种意义上仍然是同一个对象只是有了新的值。
因此,如果您只是创建一个新列表,而不是修改原始列表并发出它,那么应该有一个简单的解决方案。
例如,这应该解决问题:

emit([...state, newValue])

final newList = List.from(state)..add(newValue);
emit(newList);

(我在bloc文档中找不到解释这一点的地方,但有一些问题线程讨论了它-https://github.com/felangel/bloc/issues/2374)
本质上,状态应该是'immutable'的,所以如果你要发出一个新的状态,你应该实际上创建一个你要发出的任何状态的新示例。我通常使用状态的方式是有一个类,其中包含cubit跟踪的任何状态的final字段,以及一个copyWith方法,它可以很容易地创建一个带有任何修改字段的新示例:

YourCubitState{
    final List stateList;
    final otherField;

    const YourCubitState({
        this.stateList = [], 
        this.otherField,
    }); 

    YourCubitState copyWith({
        List? stateList,
        otherField,
    }) => 
        YourCubitState(
           stateList: stateList ?? this.stateList,
           otherField: otherField ?? this.otherField,
        );   

}

如果状态只是一个列表,那么这可能是不必要的,但是如果您发现自己想要向状态添加属性,那么这是一个很好的模式。

x33g5p2x

x33g5p2x2#

创建新的变量,将它们添加到新的变量列表中,更新新的变量列表项,使用新的变量发出数据。这就是我如何让它工作的。

late List<ServicesExpensesList> newList = <ServicesExpensesList>[];
    state.utilityDataList.forEach((element) {
      newList.add(element);
    });
    newList.insert(0, utilityData);
    newList.sort((a, b) => b.createdAt.compareTo(a.createdAt));
    emit(state.copyWith(
      utilityDataList: newList,
      status: state.status == BlocStateStatus.success
          ? BlocStateStatus.updated
          : BlocStateStatus.success,
    ))
zbq4xfa0

zbq4xfa03#

ItemCubit类的超类没有保存你的状态。你应该管理自己的状态。所以,我说的是,我说在ItemCubit类中创建列表变量,每次调用addItem方法都向这个列表添加项目并发出这个列表。
您的Cubit类应该如下;

abstract class ItemState {
  const ItemState();
}
class ItemInitial extends ItemState {
  const ItemInitial();
}
class ItemStateUpdatedList extends ItemState {
  const ItemStateUpdatedList({required this.list});

  final List<Item> list;
}
class ItemCubit extends Cubit<ItemState> {
  ItemCubit() : super(const ItemInitial());
  
  final List<Item> myItemList = [];

  void addItem(item){
    myItemList.add(item);
    emit(ItemStateUpdatedList(list: myItemList));
  }
}
body: BlocBuilder<ItemCubit, ItemState>(
          builder:(context, state) {
            if(state is ItemStateUpdatedList){
              final list = state.list;
              return TabBarView(...);
            }
            return const SizedBox.shrink();
          },
)
lf5gs5x2

lf5gs5x24#

Cubit或block是一个状态更改发射器,由于state是一组属性和特性,因此这里的关键是Cubit和Bloc能够确定属性或属性已更改的内容,否则将不会发出新的状态。
这就是我的工作方式:

abstract class ObjectListState extends Equatable {
`final List<String> items;
 const ObjectListState(this.items);
 }

class ObjectListStateInitial extends ObjectListState {
 const ObjectListStateInitail(super.items);
  @override
   List<Object> get props => [];
 }

class ObjectListStateItemAdded extends ObjectListState {
  final String item;
  final List<String> items;
  ObjectListStateItemAdded( this.item, this.items) : super(items){
   items.add(item);
   }

   @override
  List<Object> get props => [item,items];
  }
xienkqul

xienkqul5#

A也有同样的问题,我只是在 prop 上加了一个随机数
“Listget props =〉[cbspsrListadePalabras,Random().nextInt(10000)]< Object>;”

相关问题