9

我对如何使用 React 有自己的看法，并且正在构建自己的框架，受 Om 的启发。我正在实现一些类似于 Flux 架构的东西，商店可以在某些事件上更新自己。

我不确定的是为什么在 Flux 架构中我们需要存储依赖项？

商店不应该是给定有界上下文的自包含数据持有者，就像我们对 CQRS 架构所做的那样？

在事件系统中，2 个 CQRS 组件最终可能持有相同的数据。我们是否表达了存储依赖关系以避免在存储中保存重复数据？

有人能想出一些非常具体的用例，其中需要存储依赖项并且问题很难以任何其他方式解决吗？我自己一个都找不到。

4

2 回答 2

4

在回流js中，我们waitFor以两种方式解决，一种用于顺序数据流，另一种用于并行数据流。我尝试以一种避免持有相同数据（即双重维护数据）的方式对数据存储进行建模。

基本上，数据存储是 CQRS 组件，我尽量避免让 2 个数据存储最终得到相同类型的数据。如果我需要以某种方式转换只有某些组件需要的数据，我会将其分解为“聚合”数据存储。天真的实现：

var carsStore = Reflux.createStore({
    init: function() {
        this.listenTo(Actions.updateCars, this.updateCallback);
    },
    updateCallback: function() {
        $.ajax('/api/cars', {}).done(function(data) {
            this.trigger(data.cars);
        }.bind(this));
    }
});

我们可以创建另一个数据存储，通过监听来聚合数据carsStore：

var modelsStore = Reflux.createStore({
    init: function() {
        this.listenTo(carsStore, this.carsCallback);
    },
    carsCallback: function(cars) { // passed on from carsStore trigger
        this.trigger(this.getModels(cars)); // pass on the models
    }
    getModels: function(cars) {
        return _.unique(_.map(cars, function(car) { return car.model; }));
    }
});

这样你的 React 视图组件可以使用一个来获取汽车，另一个来获取模型，模型是从carStore.

如果存储需要等待两个并行数据流完成，我们提供Reflux.all加入操作和存储。这很有用，例如，如果您正在等待从不同的 REST 资源加载数据。

var carsAndPartsAreLoaded = Reflux.all(carStore, partsStore);

// you may now listen to carsAndPartsAreLoaded 
// from your data stores and components

希望这对你有意义。

于 2014-08-11T14:26:14.317 回答
1

我终于构建了一个类似于 Flux 商店的应用程序，没有任何依赖。

最近 Dan Abramov 创建了一个框架（Redux），它强调了通量存储可组合性，不需要任何存储依赖或waitFor，我分享了他的大部分想法

于 2015-07-15T16:05:28.670 回答