3

我知道在颤振中存在一些关于状态管理的问题，但似乎没有一个能解决我的用例。

最近我在构建一个基于电子商务的应用程序，并遇到了对状态管理的真正需求。我有2页，

  1. 一个是产品页面，我在其中将产品添加到购物车。
  2. 第二个是购物车页面，我看到最近添加到购物车的产品。

产品和购物车页面

用户可以将产品添加到购物车，然后导航到购物车。在购物车页面中，他们还可以增加或减少商品的数量。

如您所见，最初黄色商品以数量 3 添加到购物车中，但在购物车页面中，用户按下 (-) 按钮并将数量减少为 1。现在如果用户按下后退按钮，则状态为黄色产品在产品页面上仍将是 3。与粉红色产品类似的情况。

因此，我尝试使用普通的 setState 和一些全局数据结构来解决这个问题，以跟踪数量。但是随着我的应用程序变大，跨页面维护状态真的很困难。我已经阅读了不同的状态管理解决方案，如 redux、BloC 模式、Provider ......但我不清楚如何在我的用例中使用它们中的任何一个。任何有经验的人，可以分解岩石并帮助我消化吗？

任何有关如何解决此问题的示例代码和解释将不胜感激！

希望我的问题很清楚！

4

2 回答 2

1

ANUP SAJJAN可以使用Provider包来实现这一点。根据您的情况查看这些代码示例：

import 'package:flutter/material.dart';

import 'models/cartmodel.dart';

class AppState with ChangeNotifier {
  List<CartModel> _cartModel = new List<CartModel>();

  // Cart data list
  List<CartModel> get getCart => _cartModel;

  // Add item to cart
  addToCart(CartModel value) {
    _cartModel.add(value);
    notifyListeners();
  }

  // Remove item to cart
  removeToCart(CartModel value) {
    _cartModel.remove(value);
    notifyListeners();
  }
}

在中创建一个实例main.dart：

runApp(
  ChangeNotifierProvider<AppState>(
      create: (_) => AppState(),
      child: MyApp(),
    ),
)

您现在可以控制状态：

@override
Widget build(BuildContext context) {
  final appState = Provider.of<AppState>(context);
  ...
  // manipulation
  appState.getCart
  appState.addToCart(value)
  appState.removeToCart(value)
  ...
}
于 2020-07-08T07:15:01.930 回答
0

状态实际上是控制一个屏幕状态的载体，而不是数据存储。在这种情况下，您可能不应该使用 State，而应该使用数据库。当用户编写他们的购物车时，您可以在用户的​​设备 SQLite 或云端（Firebase？）中创建购物车记录。起初这可能看起来有点过头了，但考虑到除了拥有可以从任何地方访问的持久存储之外，您还可以获得用户行为数据，即他们添加了什么、他们如何进行以及有多少人离开了。

至于这方面的技术方面，在 Flutter 中使用 Providers 是很常见的。对我来说，最大的好处是业务逻辑封装。如果您不这样做，您的特定数据库逻辑将遍布表示层，如果您想更改某些内容，您将遇到麻烦:)

这是一篇关于提供者的好文章。

于 2020-07-08T06:59:39.283 回答