1

我使用 BLoC 模式开发了一个购物车，但我在尝试学习子集 Cubit 时遇到了困难。我的主要问题是如何显示以前更新的 Cubit 的状态？我的流量是下一个...

  1. 在产品屏幕上，我增加/减少我想要使用的项目。
  2. 要推动更改状态，我单击一个按钮并将项目作为参数发送到 Cubit 函数。
  3. 项目列表已更新，我想将其放入产品屏幕之外的另一个小部件中。

这是代码：

主要.dart

void main() {HttpOverrides.global = new MyHttpOverrides();
runApp(
RepositoryProvider<AuthenticationService>(
  create: (context) {
    return AuthService();
  },
  child: MultiBlocProvider(
    providers: [
      BlocProvider<AuthenticationBloc>(
          create: (context) {
            final authService = RepositoryProvider.of<AuthenticationService>(context);
            return AuthenticationBloc(authService)..add(AppLoaded());
          }
      ),
      BlocProvider<CartCubit>(create: (context) => CartCubit())
    ],
    child: MyApp(),
  ),
)
);
}

product_screen.dart

BlocBuilder<CartCubit, List<Item>>(
              builder: (context, state) {
                return Row(
                  children: [
                    _shoppingItem(0),
                    SizedBox(
                      width: SizeConfig.blockSizeHorizontal * 2,
                    ),
                    Container(
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.all(Radius.circular(10.0)),
                        color: Color(0xFF48AD71),
                      ),
                      child: IconButton(
                        onPressed: () {
                          for (int i = 1; i <= counter; i++) {
                            items.add(widget.item);
                            print('something');
                          }
                          context.read<CartCubit>().addToList(items);
                        },
                        icon: Icon(
                            Icons.shopping_bag),
                        color: Colors.white,
                      ),
                    ),
                  ],
                );
              },
            )

cart_cubit.dart

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

void addToList(List<Item> items) {
state.addAll(items);
emit(state);
print(state);
}
}

我应该在购物车屏幕上添加什么以便获得 Cubit State 的值？另外，这应该通过使用块而不是肘更好地处理吗？

编辑：根据 Loren.AI 的评论删除了我 ProductScreen 的 BlocBuilder 并将其添加到我的 CartScreen 中。

class _CartScreenState extends State<CartScreen> {

@override
Widget build(BuildContext context) {
SizeConfig().init(context);
return SingleChildScrollView(
  child: BlocBuilder<CartCubit, List<Item>>(
    builder: (context, state) {
      return Column()
...
...
      Align(
                  alignment: Alignment.topRight,
                  child: Text(
                    state.length.toString(), // this is not updating
                    textAlign: TextAlign.end,
                    style: TextStyle(
                        fontFamily: 'SinkinSans',
                        fontSize: 12.0,
                        fontWeight: FontWeight.w400,
                        color: Color(0xFFC9C9C9)),
                  ),
                ),
4

1 回答 1

0

Cubit对此很好。您可以根据该列表更新应用程序中任何位置的小部件，只需添加另一个BlocBuilder<CartCubit, List<Item>>. 因此，只需将另一个添加到您的购物车页面，然后在其中执行您必须执行的操作。它将反映以前的更改。

编辑：刚刚注意到，您实际上并没有在产品屏幕上重建任何小部件，因此BlocBuilder您实际上并没有做任何事情。您可以删除它并在需要反映列表值的地方使用它。您仍然可以addToList在不进入BlocBuilder.

于 2021-02-17T03:51:31.967 回答