如何将Flux连接到Sinatra API

Question

我正在使用React作为Web应用程序，并且我已经开始了解Flux。我喜欢单向数据流的概念，但我在理解如何连接到API时遇到了一些问题。

我有一个在Sinatra写的后端。我感到困惑的是数据如何从与组件的交互流向后端再返回？数据库和Flux称之为商店是两回事吗？

我解释它的方式是这样的：

用户与之反应查看=>

行动造物主将数据发送到后端=>

后端响应行动的创造者与互动新数据/成功/错误=>

动作创建者发送动作和响应于分派=>

分派器看到交流重刑，并要求根据该动作回调， 传递给它的后端响应=>

使用后端响应存储更新本身=>

商店发送变更事件和数据的阵营视图=>

的阵营视图的渲染数=>

（循环重复）

让我困惑的是商店是如何工作的。我需要两个商店，比如我如何解读它？或者后端应该是商店？

Answer 1

不，你“只是”有一家店 - 它通常有助于在一家商店 - 一个组件关系中考虑它。请注意，这应该与一粒盐一起服用，因为绝对有可能将多个商店连接到一个组件，反之亦然。

有可以实现后台通信的几种方法，但我通常的方式做它是这样的，通常与流量的Reflux implementation（因为我觉得它更直截了当，并遵循大致相同的概念作为一个阵营组件） ：

var SomeStore = Reflux.createStore({ 
    getInitialState: function() { 
     //called when store is created 

     var ApiPromise = MyApi.get('/my-resource-path/'); 
     ApiPromise.success(function (data) { 
       this.data = data; 
       this.triggerUpdateOfComponent(this.data); 
     }.bind(this)); 
    } 
}); 

使用只是正常的流量实现你会做这样的调度和应用程序开始加载时，你会触发通过Action造物主的行动，告诉调度员开始做其工作。

为了帮助进行商店的营销，可以将其视为处理与组件数据相关的逻辑和操作的容器。