Question

我正在使用MVC模式和mobx在Flutter中构建购物应用程序，以进行应用程序状态管理。

目前，我有一家mobx商店，用于存放购物车物品，还有一个商店，用于存放购物车控制器。

购物车控制器有一个购物车物品的ObservableList，问题是我不知道是否有一种观察购物车物品变化的方法。

例如，我想观察cartItem.title或cartItem.total。

有没有一种方法可以通过ObservableList进行跟踪？可观察列表具有的.observe（）方法是什么？（认为文档对我来说不清楚）

更新：示例代码

正如我说的，我必须去堆苏特，一个用于购物车商品，另一个用于购物车本身。

在购物车商品商店中：


import 'package:mobx/mobx.dart';

part 'cart-item.model.g.dart';

class CartItemModel = _CartItemModel with _$CartItemModel;

abstract class _CartItemModel with Store {
  int id;
  String title;
  String price;
  String description;

  @observable
  int _quantity = 0;

  @observable
  double _total = 0;

  _CartItemModel({
    this.id,
    this.title,
    this.price,
    this.description,
  }) {
    reaction(
      (_) => _quantity,
      (quantity) {
        getTotal();
      },
    );
  }

  getItemQuantity() => _quantity.toString(); // Return item quantity

  @action
  increase() {
    // Increase item quantity
    if (_quantity <= 99) {
      _quantity++;
    }
  }

  @action
  decrease() {
    // Decrease item quantity
    if (_quantity > 0) {
      _quantity--;
    }
  }

  @action
  getTotal() {
    // Return total price by item quantity
    _total = double.parse(price) * _quantity;
    return _total.toString();
  }
}

然后在购物车控制器中：


import 'package:faccioo_user_app/models/cart-item.model.dart';
import 'package:mobx/mobx.dart';

part 'cart.controller.g.dart';

class CartController = _CartController with _$CartController;

abstract class _CartController with Store {

@observable
  ObservableList<CartItemModel> cartItems = ObservableList<CartItemModel>();

  @action
  addItem(CartItemModel item) {
    cartItems.insert(0, (item));
    item.increase();
  }

  @action
  removeItem(CartItemModel item) {
    cartItems.removeWhere((cartItem) => cartItem.id == item.id);
    getTotal();
  }

  @action
  getSubtotal() {
    cartItems.forEach((item) {
      subtotal = subtotal + double.parse(item.getTotal());
    });
    return subtotal.toString();
  }

  @action
  getTotal() {
    total = (subtotal + shippingFee + serviceFee + change) - discount;
    return total.toString();
  }

}

例如，不是通过cartItem.total的更改来通知视图？如何观察ObservableLis中cartItemModel.total的变化？

更清楚地说，我得到此打印，在其中可以看到购物车项目数量和总增加量，因此CartItemModel反应性正常，但购物车控制器无法跟踪ObservableList的更改，因此该控制器未更新视图。

我真的很感谢链接和参考，从那里我可以了解更多有关Flutter和可观察列表的mobx。

Cart view with cart item

如何观察ObservableList项目属性更改

0 个答案: