直接在组件状态中设置标志,而无需进入完整的 Flux 循环
Setting a flag in component state directly without getting into a full Flux cycle
我最近才开始使用 FLUX,需要一些关于如何更新组件状态和存储的建议。
我需要设置一个绑定到 onclick 事件的切换标志,根据我在 Flux 体系结构中的理解,我应该调用一个动作然后触发一个调度事件然后商店将更新并发出更新结果我的组件接收更新并重新渲染。 (如果我在这里错了,请纠正我)
组件代码如下所示:
...
_updateState:function(){
this.setState({myTrigger: MyStore.myTrigger});
},
_onClickEvent: function(boolValue){
MyActions.updateTrigger(boolValue);
},
...
render: function(){
return: (
...<div onClick={this._onClickEvent}/>...
)
}
...
我想知道为什么我不应该直接调用 setState 直接触发重新渲染并避免经历我并不真正需要的完整通量循环,因为我将始终传入 "true"对于此功能,这实际上与不将任何数据传递给商店是一样的。
代码将如下所示:
...
_onClickEvent: function(){
this.setState({myTrigger: true});
}
...
在我看来,这是绕过 flux single 直接处理流程概念并在组件内创建组件事件循环。这是错误的做法吗?任何人都可以帮助我理解为什么这样做是好的还是坏的做法背后的原因?
非常感谢!
DD
这没有错。 Flux 数据流旨在处理在组件之间持久化或共享的数据。如果数据仅在该组件中使用并且没有数据持久化,那么您展示的最后一个示例是正确的方法。没有必要使事情过于复杂,这不是 Flux 存在的原因。
Flux 为您提供单向数据流架构。这意味着如果您的应用程序想要共享或存储数据,那么您想要使用 Flux 架构。这样您就可以获取或 post 数据,然后在新数据到达时通知您的组件。
消息系统就是一个例子。你想获取一条消息。
首先,您使用 MyAction.fetchMessage(message);
触发一个动作
然后,您向存储消息的任何应用程序发出获取请求。当 returns 您将数据发送到 MessageStore
缓存数据的地方。之后,您从商店触发一个事件,告诉组件新消息已经到达。从那里开始,组件只是从商店中获取新消息并重新呈现。
那是Flux架构辉煌的时候。很容易看到通过您的系统的数据流,这使得调试更容易,并且更容易将数据与组件分开。
我最近才开始使用 FLUX,需要一些关于如何更新组件状态和存储的建议。
我需要设置一个绑定到 onclick 事件的切换标志,根据我在 Flux 体系结构中的理解,我应该调用一个动作然后触发一个调度事件然后商店将更新并发出更新结果我的组件接收更新并重新渲染。 (如果我在这里错了,请纠正我) 组件代码如下所示:
...
_updateState:function(){
this.setState({myTrigger: MyStore.myTrigger});
},
_onClickEvent: function(boolValue){
MyActions.updateTrigger(boolValue);
},
...
render: function(){
return: (
...<div onClick={this._onClickEvent}/>...
)
}
...
我想知道为什么我不应该直接调用 setState 直接触发重新渲染并避免经历我并不真正需要的完整通量循环,因为我将始终传入 "true"对于此功能,这实际上与不将任何数据传递给商店是一样的。 代码将如下所示:
...
_onClickEvent: function(){
this.setState({myTrigger: true});
}
...
在我看来,这是绕过 flux single 直接处理流程概念并在组件内创建组件事件循环。这是错误的做法吗?任何人都可以帮助我理解为什么这样做是好的还是坏的做法背后的原因?
非常感谢! DD
这没有错。 Flux 数据流旨在处理在组件之间持久化或共享的数据。如果数据仅在该组件中使用并且没有数据持久化,那么您展示的最后一个示例是正确的方法。没有必要使事情过于复杂,这不是 Flux 存在的原因。
Flux 为您提供单向数据流架构。这意味着如果您的应用程序想要共享或存储数据,那么您想要使用 Flux 架构。这样您就可以获取或 post 数据,然后在新数据到达时通知您的组件。
消息系统就是一个例子。你想获取一条消息。
首先,您使用 MyAction.fetchMessage(message);
触发一个动作
然后,您向存储消息的任何应用程序发出获取请求。当 returns 您将数据发送到 MessageStore
缓存数据的地方。之后,您从商店触发一个事件,告诉组件新消息已经到达。从那里开始,组件只是从商店中获取新消息并重新呈现。
那是Flux架构辉煌的时候。很容易看到通过您的系统的数据流,这使得调试更容易,并且更容易将数据与组件分开。