标签: flux

我是与状态管理人员合作的新手。目前，我正在开发 blazor 应用程序，我偶然发现了“fluxor”框架，它允许通过 Flux 模式进行状态管理。Fluxor 对我来说工作得很好，但是我似乎无法弄清楚页面状态的实际存储位置。它是在缓存、数据库还是其他一些奇特的方式中？有没有办法让我看到浏览器中存储的数据？

顺便说一下，我在应用程序的客户端使用 Fluxor。

谢谢你的协助！

嗨,我正在尝试使用go-lang后端构建Flux/React应用程序.我一直在按照我在这里找到的教程.但是我在建立商店时遇到了问题.在教程中,这样的东西用于为商店创建一个基础.

var ProductStore = _.extend({}, EventEmitter.prototype, {...});

我遇到的问题是我无法访问EventEmitter库,我理解它是一个Nodejs库？有没有我可以使用的替代方案？

有没有办法如何console.log()在Reflux中全局解雇所有被激活的行为？理想情况下,同时打印他们的参数.

我有一个反应应用程序,我想在我的应用程序的多个部分中使用"Dispatcher架构",它们彼此完全无关.

(一个是传统的组件/操作/存储处理,另一个是一些可互换的插件,可以通过这种方式注册到Dispatchers,从而将它与主应用程序分离.)

由于这两个部分彼此无关,我想为它使用两个不同的调度程序.

是否可能,或者由于调度员是单身人士,我只能使用一个？

所以我对React相当新,我无法围绕如何基于另一个组件重新渲染主要组件的概念.

假设我们有一个待办事项,待办事项可以有一个状态(新的,运行的,关闭的).我们在列表中显示所有待办事项,我们可以根据状态过滤项目.我们使用bootstrap dropdownbutton like component来设置过滤器,这是一个React组件.现在,当我们更改过滤器时,我们显然想要刷新待办事项.

我的问题是,所选状态的逻辑是否属于Flux/Redux,或者过滤器组件是否只是将"刷新项目"说成主要组件？

tl; dr:mridgway在这里描述的相同问题:isMounted不足以知道你是否可以setState

我有一个像这样的组件层次结构:

PhasesList
- Phase
  - PhaseHeader
- Phase
  - PhaseHeader

还有一个PhaseStore,它维护一个阶段列表及其详细信息.

在所有三个组件中,我监听PhaseStore更改并根据更改更新状态(重新呈现).例如,如果用户在PhaseHeader中更改阶段名称,则会触发操作,存储更新并发出更改事件.该更改事件将传播到PhaseList,Phase和PhaseHeader,并使用实际名称值进行呈现.

有一个问题,我可以删除一个阶段.此操作在PhaseStore中处理,其中相位从列表中删除并发出更改事件(如在其他情况下).此事件由所有组件处理,从上到下(因为所有组件都监听商店更改).

因此,在PhasesList中,渲染新的阶段集,而不删除一个阶段.但是,移除的阶段组件仍然会收到更改事件,而PhaseHeader也会收到更改事件.

在这两个组件中,在相变处理程序中我使用setState.我得到的信息是这样的:

警告:setState(...):只能更新已安装或安装的组件.这通常意味着您在已卸载的组件上调用了setState().这是一个无操作.

我发现人们使用isMounted来检查组件是否仍在DOM中.此方法现已弃用.

我怎样才能以适当的流量方式解决这个问题？设计我的组件及其相互通信有什么问题？

当状态改变时,我有自动重新渲染视图的问题.国家已被改变,但render()没有被称为.但是当我打电话时this.forceUpdate(),一切都还可以,但我认为这不是最佳解决方案.有人可以帮助我吗？

class TODOItems extends React.Component {

constructor() {
    super();

    this.loadItems();
}

loadItems() {
    this.state = {
        todos: Store.getItems()
    };
}

componentDidMount(){
    //this loads new items to this.state.todos, but render() is not called
    Store.addChangeListener(() => { this.loadItems(); this.forceUpdate(); });
}

componentWillUnmount(){
    Store.removeChangeListener(() => { this.loadItems(); });
}

render() {

    console.log("data changed, re-render");
    //...
}}

我正在开发使用Meteor和React作为视图引擎的应用程序

考虑下图：

从另一个示例反应隐藏组件

当触发C4按钮单击事件时，我需要更改C2组件状态。由于他们没有直接关系，因此我无法直接从C4进入C2状态。

另一个示例是从Component提交表单并获取在另一个Component中声明的数据（输入字段的值）。

我知道可以通过一些技巧来解决此问题（例如，流星会话，通过每个组件传递数据，基于流量的Action / Dispatcher）。

React docs建议使用事件/订阅系统（通量是一种可能的解决方案，但通量不止此...）在组件之间进行通信

Redux是另一种可能性（对于一个大型应用程序，如果我有很多动作，我会有些担心，因为组合减速器功能会爆炸，而且对于没有动作专用的订阅系统，到目前为止）我知道在调度操作时将执行所有侦听器-我是redux的新手，也许我错了）

Flux或Redux是有效的模式，可以满足比我更大的需求，我已经有过Meteor这样的工作。我唯一需要的是访问另一个内部的组件状态。

我需要具有大量组件视图的中型/大型应用程序的可伸缩解决方案

解决该问题的“正确”方法是什么？

更新：

最近我给了redux一个机会，它似乎可以完成工作（它确实很棒并且得到了很好的支持），因此，如果您在相同的情况下，请检查React + Redux：提交多组件表单

因为它保证按时间store.dispatch返回，状态已经改变了？如果是这种情况，那么为什么不通过调度调用返回newState？

store.dispatch( action1() );
store.dispatch( action2() );

一个示例，我将在action1中登录用户，然后我要触发另一个将使用LOGEDIN用户信息来进一步更改状态的操作。因此，我想确保除非action1已成功更改状态，否则不会触发action2。

因此，在store.dispatch返回时，是否保证状态已经改变？

减速器示例：

function reducer(state, action){
  // please ignore that i will mutate state, just for sake of simplicity of example.
  if(action.type==='ACTION1'){
   state.user_id = action.payload;
   return state;
 } 

 if(action.type==='ACTION1'){
   state.value2 = state.user_id * action.whatEver;
   return state;
 }

  return state;
}

我当前的保护是我使用React.component监视对user_id的更改，然后触发action2，但是如果Redux Actions是同步的，则可以在action1之后直接触发action2并减少我的样板。

我期待这段代码将事件传递给客户端(代码在Kotlin中,但Java非常相似)

@RestController
object CustomerController {
    @GetMapping("/load", produces = arrayOf("application/stream+json"))
    fun load(): Flux<String> {
        var flux = Flux.fromIterable(ResultIterable())
        flux.subscribe({println(it)})
        return flux
    }
}

ResultIterable是一个可定期生成字符串的iterable.基本上是无限流.

我没有看到任何输出,它永远挂起.

我确实看到了定期打印的字符串(println(it)).

我使用以下卷曲:

curl -X GET   http://localhost:8080/load   -H 'accept: application/stream+json'   -H 'cache-control: no-cache'   -H 'content-type: application/stream+json'